reactjs - 使用 mapStateToProps 连接时“无法读取未定义的属性 'map'”

标签 reactjs redux react-redux

我试图在我的 react/redux 功能组件中显示我的状态(用户):

const Dumb = ({ users }) => {
  console.log('users', users)
  return (
    <div>
      <ul>
        {users.map(user => <li>user</li>)}
      </ul>
    </div>
  )
}

const data = state => ({
  users: state
})


connect(data, null)(Dumb)

Dumb 用于容器组件。 users.map 语句有问题,但我认为数据是通过 connect 语句注入(inject)的? reducer 有一个初始状态,其中包含 1 个名称:

const users = (state = ['Jack'], action) => {
  switch (action.type) {
    case 'RECEIVED_DATA':
      return action.data

    default:
      return state
  }
}

CodeSandbox

最佳答案

渲染时您没有使用连接的组件,因此组件中的 Prop 不可用

const ConnectedDumb = connect(
  data,
  null
)(Dumb);

class Container extends React.Component {
  render() {
    return (
      <div>
        <ConnectedDumb />
      </div>
    );
  }
}

Working demo

关于reactjs - 使用 mapStateToProps 连接时“无法读取未定义的属性 'map'”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53386202/

相关文章:

javascript - 当卸载/重用 React 组件时,如何取消 Promise 中的下一个 'then'?

reactjs - 使用自定义 Thumb 组件的移动设备上的material-ui slider 的奇怪行为

reactjs - 为什么我在运行 ESLint 时得到 "Definition for rule ' import/no-extraneous-dependencies' was not found”?

javascript - 无法导入 Antd 单个组件而不搞乱全局样式

reactjs - 'TypeError [ERR_INVALID_ARG_TYPE] : The "path" argument must be of type string. 接收类型未定义'

javascript - 我应该在初始渲染期间使用 redux 调度吗?

javascript - 在同一个存储中可以有多个监听器中间件吗?

ios - PWA 重定向到登录页面并陷入 2FA 循环

javascript - React-redux REST API this.state 为 null

javascript - 使用通用操作和 reducer 简化 redux