React进阶训练

redux

Redux就是给JavaScript应用程序一个可以预测state的容器。

使用Redux的时候一定要记得以下三大原则:

  1. single source of truth:应用程序的state,皆存储在唯一一个树状结构的store中;
  2. state is read-only:唯一改变state的方式,发送一个描述如何改变的action
  3. changes are made with pure functions:为了描述action如何改变statereducer必须改成pure function

具体运行

  1. 当我们要改state时,必须**通过dispatch发送一个action对象到store**,这个action对象是用来描述发生了什么事。
  2. store基本上也不知道收到这个用来做什么,因为它是用来存储state tree的地方,所以store把「自己目前的state」及「action」交给给Reducer处理
  3. reducer是一个pure function,它会**根据我们action的要求去做state的更改,并将新的state回传给store**。
  4. 我们可以让component去做监听redux裡面的storestate,只要一旦发现state有发生变化,就会立即帮我们重新Render

store

store主要的功能就是掌管应用程式的状态,并且有这些任务:

  1. 掌管应用程式的状态
  2. getState()读取state
  3. dispatch(action)来更新state
  4. subscribe(listener)注册listener
  5. 利用subscribe(listener)回传的function注销listener

redux的应用程式中,store只会有一个。

创建state的方法就是利用createStore(reducer)的方式创建它,而要发送action则利用dispatch(action)来达到,当store收到action时,则会调用reducer来帮忙更新state