连线数据

本教程不关注构建应用程序的细节,因此我们不会在此处深入研究这些细节. 但我们将花点时间研究一下 与容器组件 连接数据 的常见模式.

我们的目前编写的组件是"表现性的" (见) 因为它不会与 其自身实现之外 的任何内容交谈. 为了获取数据,我们需要一个"容器".

首先,我们将构建一个简单的Redux存储,它在一个src/lib/redux.js中定义改变任务状态的操作 (故意保持简单) :

然后我们将更新默认导出组件连接到Redux存储,并呈现我们感兴趣的任务:

但是,我们可以通过简单地渲染PureTaskList来轻松解决这个问题 - 我们的 Storybook故事中的表现部分:

同样,我们需要使用在我们的Jest测试中: