redux 使用步骤

跟着 Redux 的中文文档，一步一步实现自己的第一个 React 项目，发现 Redux 的原理与特性太难理解了。初始数据不够直观（无从下手）、各种数据的穿插太乱（数据经常走丢，找不着）、同步与异步太笼统（不够明确区分两者有啥区别）。

官网的定义：

Redux 是 JavaScript 状态容器，提供可预测化的状态管理。 (如果你需要一个 WordPress 框架，请查看 Redux Framework。)

可以让你构建一致化的应用，运行于不同的环境（客户端、服务器、原生应用），并且易于测试。不仅于此，它还提供 超爽的开发体验，比如有一个时间旅行调试器可以编辑后实时预览。

Redux 除了和 React 一起用外，还支持其它界面库。 它体小精悍（只有 2kB，包括依赖）。

其他教程

Redux 中文文档

Redux 作者自己出的视频教程

准备工作

最小的例子（有点诡异）

同步示例

要不先看看这篇文章？

组件之间的数据（store）交互需要用到 react-redux 中的 方法，将需要的个别数据（state）拿到，还有一些触发器（dispatch）串联在一起。

现在为上面例子的 Baby 创建一个组件，名为 ，内容如下：

很明显，上面的例子名字写死了，年龄也不能通过按钮累加，改成如下即可通过对象取到你所想要的。

异步示例

异步操作，其实就是同步的三个状态，每个状态调用（还是 dispatch）不同的触发器。

三个状态指的是：请求开始1，请求结束（成功2或失败3）；

而不是请求开始、请求中、请求结束（很容易误解）。

Baby 爸妈去局里改名字啦~

改改上面的例子：