Redux

[ZoeyYoung]

Getting Started with Redux

（Redux作者录制，视频详解了 Todos 这个示例的由来，入门看这个很有帮助「如果能听懂英文」）

awesome-redux =》这里面的文章都能过一遍也就差不多了

文档&库

Redux中文文档
redux
react-redux
redux-thunk
redux-logger

Provider 的作用：传递Store

connect()的作用：生成容器组件

import { connect } from 'react-redux';

const mapStateToProps = (state) => ({
  xxx: stateXXX
})
const mapDispatchToProps = (dispatch) => {
  return {
    xxx: (xxx) => {
      dispatch(actionCreatorXXX)
    }
  };
}
const ContainerComponent = connect(mapStateToProps, mapDispatchToProps)(Component);

中间件

http://camsong.github.io/redux-in-chinese/docs/advanced/Middleware.html

It provides a third-party extension point between dispatching an action, and the moment it reaches the reducer.

基本形式

store => next => action => {
  ...
  let result = next(action)
  ...
  return result
}

工具

Chrome 插件 Redux DevTools

[ZoeyYoung]

博客

深入到源码：解读 redux 的设计思路与用法 => 代码有点旧，参照Redux源码看

http://teropa.info/blog/2015/09/10/full-stack-redux-tutorial.html

还在纠结 Flux 或 Relay，或许 Redux 更适合你

[ZoeyYoung]

一个争论点，多个Action来完成一个State变更，还是一个Action完成所有变更

我是比较倾向于后面

1）多个Action会导致页面render多次
2）每个Action结束都不能保证数据的正确性，数据的正确性要依赖于容器是否根据state的变化调用相应的Action

场景

�一个Action的情况

添加数据成功后

1）表单数据可清空
2）数据列表更新

多个Action的情况

1）Action 1 添加数据成功
2）Action 2 重新加载数据列表（通过在容器中用某种方式判断balabala，如果容器没干这件事情，就是一个潜在的BUG）

Redux作者关于这个问题的回答：redux/issues/749、redux/issues/601

[ZoeyYoung]

遇到的问题

�logout时需要进行数据清理

在项目中，用户登出的时候store和全部清理，如果所有reducer都监听登出事件有点傻，肯定有简单的方式

http://stackoverflow.com/questions/35622588/how-to-reset-the-state-of-a-redux-store

两种方式，其中比较简单的方式就是跳转到登录页时刷新，直接恢复至最原始�state