当前位置: 首页 > 面试题库 >

与mapStateToProps一起使用时,“无法读取未定义的属性'map'”

薛焱
2023-03-14
问题内容

我试图在我的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)

哑巴用于容器组件中。users.map语句有问题,但是我认为数据是通过connect语句注入的?减速器的初始状态为1个名称:

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

    default:
      return state
  }
}

CodeSandbox


问题答案:

渲染时未使用连接的组件,因此道具在组件中不可用

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

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

工作演示



 类似资料:
  • 我不知道问题是什么。它不应该监听错误,因为我选择有条件地呈现消息。 我尝试将设置为no成功。 我尝试失败。 我尝试了我认为问题可能出在扩展ErrorHandlerProps接口的某个地方,但我已经扩展了MapStateToProps?

  • 我正在使用数据来显示来自服务器的数据。问题是我一直在控制台上得到一个错误,说: 我已经访问了互联网上与此相关的每一个链接,但对我来说没有任何效果。 我已经确保了使用colspans的thead和tbody中的列数是相同的。 我可能遗漏了一些东西,但在花了相当长的时间之后,我会感谢您的帮助。 下面是代码的样子 HTML: JS

  • 为什么我得到这个错误不能读取未定义的触摸属性? 为什么它不能读取,但它可以读取 当我们使用

  • 问题内容: 我正在制作非常简单的react应用。但是,当我尝试通过onChange事件调用父(实际上是祖父母)组件的方法时,我一直在获取。 这是触发事件的组件/表单(因此,在绑定的父组件上调用方法…是的,因为我通过道具将其从父组件传递下来,所以在方法上使用了.bound(this)。) 这是我如何通过大多数父(祖父母)组件中的props传递该方法的方法。 这是我作为父项(方法所有者和方法调用程序之

  • 我正在测试发送电子邮件与流星js和nodemailer插件: 流星添加捷运:流星NodeEmailer 当页面加载时,我在导航器的控制台上看到错误:无法读取未定义的属性“创建运输”。 那么问题是什么呢? 代码如下: /////////////////////////////////////////// ///////////////

  • 我知道这方面还有很多类似的问题,但没有一个答案是有效的。在我的例子中,我有下面的代码,我正在尝试按分数降序排列记录数组。 最后一个函数是什么给我的问题.如果用户运行以下: var web=[{url:“www.southanpton.ac.uk”,内容:“南安普敦大学提供学位课程和世界一流的研究测试。”,{url:“www.xyz.ac.uk”,内容:“另一种大学考试”},{url:“www”,内