我们先把redux和react连接起来
view (react)
store(state)
action
reducer
view ----> action ----> reducer --->store(state) --->view
放在一个web app中,首先store(state)决定了view,然后用户和view的交互会产生action,这些action会触发reducer因而改变state,然后state的改变又会造成view的变化。
在redux中
view 直接触发dispatch;
2 将action发送到reducer中后,根节点上会更新props,改变全局view。
redux将view和store的绑定从手动编码中提取出来,放在了统一规范放在了自己的体系中。
而在基本的redux流程中,action只是充当了一个类似于topic之类的角色,reducer会根据这个topic确定需要何时返回新的数据;数据的结构处理也从store中移动到了reducer中
redux的基本原理实际上就是围绕着store进行的。
这个store 就是通过createStore方法创建的。。
createStore方法接收 reducer函数 和 初始化的数据 currentState 并将这两个参数保存在store中。。
createStore时传入的reducer方法会在store的dispatch被调用,接收store中的state和action,根据业务逻辑修改store中的state。。
store中包含subscribe , dispatch , getState , replaceReducer
subscribe和dispatch就是订阅和发布功能。
subscribe接收一个回调(listener),当dispatch触发时,执行reducer函数去修改当前数据(currentState),并执行subscribe传入的回调函数(listener);
getState是获取当前store的state(currentState);
redux的缺点:
一个组件所有的数据,必须由父组件传过来,而不能像flux中直接从store取。
当一个组件相关数据更新时,即使父组件不需要用到这个组件,父组件不需要用到这个组件,父组件还是会重新render,可能会有效率影响,或者需要写复杂的shouldComponentUpdate进行判断。。
redux的优点 :
1 redux把流程规范了,统一渲染根节点虽然对代码管理上规范了一些,只要有需要显示数据的组件,当相关数据更新时都会自动进行更新。