当前位置: 首页 > 科技观察

深入Redux--Redux原理及应用三原则

时间:2023-03-21 10:12:26 科技观察

Redux工作原理Redux通过store管理全局状态;view生成并运行后,会生成一个action,通过dispatch(action)方法派发给store;store会把当前的state和这个action交给reducer处理,reducer处理完需要返回一个新的state。此时store可以知道数据的变化,然后返回通知视图获取最新的数据;基本概念和apiStoreStore是用来维护应用程序所有状态树的一个对象。更改商店内状态的唯一方法是向其发送操作。整个应用只能有一个Store。store方法提供getState()方法获取状态;提供dispatch(action)方法来更新状态;通过subscribe(listener)注册监听器;通过subscribe(listener)返回的函数取消监听。Reducerreducer实际上是一个纯函数。它接收两个参数,第一个参数是需要管理的状态,第二个是动作。reducer会根据传入的action的type值对state进行不同的操作,然后返回一个新的state,而不是修改原来的state,但是如果遇到未知(不匹配)的action,它会返回到原来的state没有任何变化。construducer=(state,action)=>{switch(action.type){caseADD_TODO:returnnewstate;defaultreturnstate}}Actionaction本质上是一个对象;它是商店数据的唯一来源。它将数据发送到Store。constaction={type:'ADD_TODO',payload:'reduxprinciple'}应用的三大原则我们在使用redux的时候,需要遵守这三个原则,就可以避免90%的bug:单一数据源,我们使用Store作为一个全局对象,并且这个对象是唯一的,所有状态在Store的状态树中都是‘统一配置’的。状态是只读的。如果要改变State,必须通过Action,action在state上更新才能生效。它是一个减速器;这确保了视图和网络请求都不能直接修改状态,而只能表达修改的意图。Reducer必须是纯函数。Reducer内部执行必须没有副作用,不能直接修改状态。当状态改变时,需要返回一个全新的对象来代表新的状态。这样就保证了同一个State一定得到同一个View。需要注意的是:不要重写参数,不要调用系统I/OAPI,不要调用Date.now()或Math.random()等不纯的方法,因为每次都会得到不同的结果作者:快乐88链接:https://juejin.im/post/6868103822271758344来源:掘金