有关于Redux……

Veröffentlicht am

这篇只是有关于Redux所记得一些笔记，比较杂乱，是初次接触到Redux我们必须应该掌握的基础知识，希望看了这篇文章对你有所帮助。

基本概念

Redux的设计思想只有两种

  • Web应用是一个状态机，视图和状态是一一对应的。
  • 所有的状态都保留在一个对象里。

Store是什么？

Store就是一个保存数据的地方，可以看做是一个容器，整个应用只能有一个Store。
Redux提供了createStore函数用来生成一个Store。

1
2
import { createStore } from 'redux'
const store = createStore(fn)

createStore函数接受另一个函数作为参数，返回新生成的Store。

State又是什么？

State对象包含了所有的数据，如果想要得到某个时点的数据，就要对Store生成快照，这种时点的数据集合就是State，当前时刻的State可以通过Store.getState()拿到。

1
2
3
import { createStore } from 'redux'
const store = createStore(fn)
const state = store.getState();

Redux规定一个State对应一个View，只要State相同，View就相同，你知道State，就知道View。

Action

State的变化会导致View的变化，但是用户接触不到State，只能接触到View，所以State的变化必须是View导致的，Actio就是View发出的通知，表示State应该要发生变化了。

Action是一个对象，其中的type属性是必须的，表示Action的名称，其他属性可以自由设置，社区内有规范可以参考。

Action的社区内规范
  1. 一个Action必须存在的属性是type
  2. 一个Action可能存在的属性
    • Error
    • payload
    • meta

Type: 是一个必须的属性，通常是一个字符串或者Symbol值，如果希望两个type的值相同，他们必须遵守严格模式下的相等规定。
payload: payload是一个可选属性，他没有规定值得属性，他表示了Action的payload，任何有关于的Action发出的消息，比如Type值得类型错误，或者状态异常是，payload都会记录在自身中。
按照惯例，如果当另一个属性值Error为true时，那么payload应该是一个Error的对象，这个有点类似于Promise中的reject函数中所带有的Error对象。
Error: Error属性有可能设为true，如果Action表示一个error的时候，当Action的某个Error的属性为true时，就类似与Promise中的reject函数，按照规定，payload应该是Error的一个对象。如果Error存在为true以外的其他的值，包括null,undefiend，那么Action就不能被看着是一个Error来解析。
meta: meat属性也可以是任何值，他是为了储存一些其他的额外信息，比如不是payload的那部分的数据而做的准备。

一些实用的函数

flux-standard-action是一个可以使用npm来获得的插件，他提供了一些很实用的方法

1
import { isFSA } from 'flux-stanard-action'