很难理解如何调度动作并将props / state传递给子组件

时间:2016-02-14 14:41:20

标签: reactjs redux react-redux

问题:我一直在搜索谷歌,阅读redux.js.org文档,查看示例(但每个示例都是彼此差异和我所拥有的)并且无法弄清楚如何让我的动作创作者发送我的动作,或者如何发送我的动作创建者的动作,或者传递我的状态等等。我只是想在列表中添加一个简单的待办事项。

期望的结果:我需要一个更好的ELI5解释,说明如何分配我的动作创建者的动作,我如何传递我的mapStateToProps的状态,因为这些例子令我感到困惑。我只是想在我的列表中添加一个简单的项目并呈现我的项目的当前状态。

我只是想得到一些指导,我不是在寻找任何人为我做这件事,到目前为止我一直在享受学习,但这是最后一天左右的砖墙。我希望链接足够每个代表我的应用程序的差异部分。如果需要,可以在此处克隆:http://github.com/laere/therealapp

更新:目前正致力于在单个JSBIN中重新创建问题:http://jsbin.com/yowenodaze/edit?js,console,output

我的代码:

我的商店(缩减器/动作创建者):http://jsbin.com/zopedipezu/edit?html,js,output

我的商店所在的主根文件。 http://jsbin.com/tapowagobo/edit?html,js,output

我的主容器/父组件使connect()引用商店。 http://jsbin.com/larisifube/edit?js,output

我的列表组件(哑组件):http://jsbin.com/zirozucehi/edit?html,js,output

我的ListItem组件(哑组件):http://jsbin.com/sijifeqalu/edit?html,js,output

更新我解决了这个问题。在我的主容器组件中连接到商店后,我能够通过this.props传递动作创建者。到其他组件!

1 个答案:

答案 0 :(得分:2)

我意识到经过一些研究和修补,我得出的结论是,我能够通过道具传递我的行为,就像在React Framework中传递任何其他数据一样。

export default class Parent extends Component {
  render() {
    return (
      <ChildComponent myState={this.props.myState}/>
    );
  }
}

const mapStateToProps = () => {
     return {
        myState: myState
  }
}