很难理解如何分派操作并将 props/state 传递给子组件

Hard time understanding how to dispatch actions and pass props/state to child components

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

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

我只是想要一些指导,我不是在寻找任何人来为我做这件事,到目前为止我一直很享受学习,但在过去一天左右的时间里这一直是一堵砖墙。我希望链接足以代表我的应用程序的不同部分。如果需要,可以在此处克隆它:http://github.com/laere/therealapp

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

我的代码:

我的商店(reducer/action 位创作者):http://jsbin.com/zopedipezu/edit?html,js,output

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

我的主要 container/parent 组件使 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 传递动作创建者。到其他组件!

我意识到经过更多的研究和修补,我得出的结论是我可以通过 props 传递我的动作,就像任何其他数据将在 React 框架中传递一样。

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

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