Skip to content

redux三大原则

单一数据源

  • 整个应用程序的state被存储在一颗object tree中,并且整个object tree只存储在一个store中
  • redux并没有强制让我们不能创建多个store,但是那样做并不利于数据的维护
  • 单一的数据源可以让整个应用程序的state变得方便维护、追踪、修改

state是只读的

  • 唯一修改state的方法一定是触发action,不要试图在其他地方通过任何的方式来修改state
  • 这样就确保了view或网络请求都不能直接修改state,它们只能通过action来描述自己想要如何修改state
  • 这样可以保证所有的修改都被集中化处理,并且按照严格的顺序来执行,所以不需要担心race condition(竞态)的问题

使用纯函数来执行修改

  • 通过reducer将旧state和actions联系在一起,并且返回一个新的state
  • 随着应用程序的复杂度增加,我们可以将reducer拆分成多个小的reducers,分别操作不同state tree的一部分
  • 但是所有的reducer都应该是纯函数,不能产生任何的副作用(返回新的state而不是修改旧state)

redux的使用过程

  1. 创建一个对象,作为我们要保存的状态
  2. 创建store来存储这个state
    • 创建store时必须创建reducer
    • 我们可以通过store.getState来获取当前的state
  3. 通过action来修改state
    • 通过dispatch来派发action
    • 通常action中都会有type属性,也可以携带其他的数据
  4. 修改reducer中的处理代码
    • 这里一定要记住,reducer是一个纯函数,不需要直接修改state
  5. 可以在派发action之前,监听store的变化

redux结构划分

  • 创建store/index.js文件
  • 创建store/reducer.js文件
  • 创建store.actionCreators.js文件
  • 创建store.constants.js文件

redux使用流程

redux在实际开发中的流程: