Store 上的方法:getState,subscribe,dispatch

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

store 上面有几个方法 .. 它的 getState 方法,可以返回应用的 state .. 用一个 console.log,可以把 store 上面的 getState 方法返回的东西输出到控制台上看一下 ..

现在我们的应用非常简单,它的 state 里面只有一个数字 .. 在控制台上输出了一个数字 0 ,它就是应用里的数据 ..

dispatch

现在我们要去修改应用的数据 .. 需要执行一个动作,或者叫指派,发出,派遣一个动作 .. 指派动作用的是 store 上面的 dispatch 这个方法 .. dispatch 这个词,按动词讲的话,它的意思就是派遣,调度,或者发出 ..

再把一个动作交给 dispatch 这个方法 .. 一个动作就是一个对象 .. 动作对象里面必须得有一个 type 属性 .. 它的值是动作的类型或者名字 .. 比如我要指派的动作是 INCREMENT,这个动作的名字你可以自己随便定义 .. 动作的名字一般都会使用大写字母 ..

在这个动作对象里,你还可以添加其它的数据,应用的 reducer 可以根据动作里的类型,还有其它的数据,去加工生成应用的新的 state ..

我们的 counter 应用,非常简单,这个动作只需要一个 type 属性就行了。

应用的 counterReducer 这个 reducer 收到动作以后,一看动作的类型是 INCREMENT,它就会让应用的 state 加上数字 1,然后返回处理之后的这个结果 .. 也就是应用的新的 state ..

subscribe

应用的 state 发生了变化以后,我们可以去做点什么 .. 比如重新渲染一下页面,显示出变化之后的结果 .. 使用 store 里的 subscribe 可以订阅应用的 state 的变化 ..

这里我们把这个在控制台上输出应用当前 state 的代码放在一个函数里面 .. 起个名字可以叫 log ..

然后把 log 这个函数,交给 store 的 subscribe 这个方法 .. 这样每次应用的 state 有变化,都会执行一下 log 这个函数 ..

下面可以再单独执行一下 log 这个函数 ..

保存一下 .. 你会发现,控制台上输出的应用的 state , 第一次是 0,指派了 INCREMENT 动作以后,应用的 state 就变成数字 1 了 ..

我们可以再去 dispatch 一个 INCREMENT 动作 ..

完成以后,应用的 state ,会是数字 2 ... 因为每次 dispatch INCREMENT 这个动作的时候,counter 这个 reducer 都会让应用的 state 加上 1 ...

Store 上的方法:getState,subscribe,dispatch《 Redux:数据管理 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点