编程语言
首页 > 编程语言> > javascript – react-redux将道具传递给子组件道具

javascript – react-redux将道具传递给子组件道具

作者:互联网

我试图将道具传递给子组件但是孩子总是收到空的.
这是使代码更清晰的代码.

当我将子组件传递给子组件时,它可以工作
这是工作代码:

 render() {
   return (
     <div>
       <PostList list={ this.state.posts }></PostList> 
  </div>
  );
}

但在我的情况下,我想从redux状态传递道具

不工作的代码:

render() {
    return (
      <div>
          <PostList list={ this.props.posts }></PostList>
      </div>
      );
  }
}
function mapStateToProps(state) {
  return {
    posts: state.posts.all,
    postDetail: state.posts.post
  }
}

任何想法为什么PostList在第二种情况下获得一个空对象,即使this.props.posts在调用组件中实际上不是空的?

谢谢

解决方法:

安装redux-devtools以查看您的redux状态实际上是什么样的.例如,如果您使用了combineReducers(),则.posts可能会以reducer的名称为前缀.

一旦验证了实际的redux状态,然后仔细检查mapStateToProps以确保引用正确的状态切片.在你的问题中,我想知道你是否需要调整它,但我不能确定你不知道你的还原状态是​​什么.

function mapStateToProps(state) {
  return {
    posts: state.posts
  }
}

请确认您要导出的内容.我假设你的render()方法包含在一个类中?如果是这样,请确保导出connect()的结果.像这样的东西:

export default connect(mapStateToProps, mapDispatchToProps)(MyReactClass)

标签:javascript,reactjs,redux,react-redux,react-jsx
来源: https://codeday.me/bug/20190823/1700304.html