redux笔记

1. Redux 要求 UI 的渲染组件都是纯组件，即不包含任何状态（this.state）的组件。

{this.props.text}

2. 进行数据处理、并包含状态的组件，称为“容器组件”。Redux 使用connect方法，自动生成 UI 组件对应的“容器组件”。

// MyComponent 是纯的 UI 组件
  const App = connect(mapStateToProps, mapDispatchToProps)(MyComponent);

3. mapStateToProps函数返回一个对象，表示一种映射关系，将 UI 组件的参数映射到state。

  function mapStateToProps(state) {
    return {text: state.text, name: state.name};
  }

4. mapDispatchToProps函数也是返回一个对象，表示一种映射关系，但定义的是哪些用户的操作应该当作Action，传给Store。

function mapDispatchToProps(dispatch) {
  return {onChange: (e) => dispatch({type: 'change', payload: e.target.value})}
}

5. reducer函数用来接收action，算出新的state。

function reducer(state = {text: '你好，访问者', name: '访问者'}, action) {
  switch (action.type) {
    case 'change':
      return {
        name: action.payload,
        text: '你好，' + action.payload
      };
  }
}

Store由 Redux 提供的createStore方法生成，该方法接受reducer作为参数。

const store = createStore(reducer);
ReactDOM.render(store, document.body.appendChild(document.createElement('div')));

为了把Store传入组件，必须使用 Redux 提供的Provider组件在应用的最外面，包裹一层。

---

6. redux和react-redux的区别？？？

Redux 和 React-redux 并不是同一个东西。Redux 是一种架构模式（Flux 架构的一种变种），它不关注你到底用什么库，你可以把它应用到 React 和 Vue，甚至跟 jQuery 结合都没有问题。而 React-redux 就是把 Redux 这种架构模式和 React.js 结合起来的一个库，就是 Redux 架构在 React.js 中的体现。

7.调用action拿取数据最好是用reducer来获取到action拿到的数据， action.then()和action.catch()多是用于检测从后台拿取数据的状况，如果通过这两种方式直接获取数据则失去了用action的意义