Redux总结3:store
来源:互联网 发布:长沙黑马程序员怎么样 编辑:程序博客网 时间:2024/04/28 04:00
我们学会了使用 action 来描述“发生了什么”,和使用 reducers 来根据 action 更新 state 的用法。而Store 就是把它们联系到一起的对象。
首先要区分 store 和 state
state 是应用的状态,一般本质上是一个普通对象
例如,我们有一个 Web APP,包含 计数器 和 待办事项 两大功能
那么我们可以为该应用设计出对应的存储数据结构(应用初始状态):
/** 应用初始 state,本代码块记为 code-1 **/{ counter: 0, todos: []}
store 是应用状态 state 的管理者,包含下列四个函数:
getState() # 获取整个 statedispatch(action) #更新 state,是触发 state 改变的唯一途径subscribe(listener) # 注册监听器,可理解成是 DOM 中的 addEventListener通过 subscribe(listener) 返回的函数注销监听器
二者的关系是:state = store.getState()
Redux 规定,一个应用只应有一个单一的 store,其管理着唯一的应用状态 state
Redux 还规定,不能直接修改应用的状态 state,也就是说,下面的行为是不允许的:
var state = store.getState()state.counter = state.counter + 1 // 禁止在业务逻辑中直接修改 state
若要改变 state,必须 dispatch 一个 action,这是修改应用状态的不二法门
store.dispatch(addTodo('Learn about actions'))
上面提到,state 是通过 store.getState() 获取,那么 store 又是怎么来的呢?
想生成一个 store,我们需要调用 Redux 的 createStore:
import { createStore } from 'redux'...const store = createStore(reducer, initialState) // store 是靠传入 reducer 生成的!
createStore() 的第二个参数是可选的, 用于设置 state 初始状态。这对开发同构应用时非常有用,服务器端 redux 应用的 state 结构可以与客户端保持一致, 那么客户端可以将从网络接收到的服务端 state 直接用于本地数据初始化。
let store = createStore(todoApp, window.STATE_FROM_SERVER)
阅读全文
0 0
- Redux总结3:store
- 【redux】Action Reducer Store
- Redux中的Store
- React-redux-webpack项目总结之reduce、action、store、components 是如何开车的
- Redux总结1:Redux基础
- 认识redux的store,reducer,action
- (二)Redux:实现一个Store
- Redux原理(一):Store实现分析
- js文件全局引用redux的store
- ReactNative redux 总结
- React-Redux总结1
- Redux总结2:action
- Redux学习总结
- redux-saga 实践总结
- redux学习总结
- redux 学习总结
- Redux的一些总结
- Redux的一些总结
- Palindrome Partitioning
- POJ2706Connect(AC)
- 【iOS开发】内存管理001之基础介绍
- 代理模式Proxy(结构型)
- Linux Socket 事件触发模型 epoll 示例 这里会写一个用C语言的TCP服务器的完全实现的简单程序
- Redux总结3:store
- Spring Boot集成kafka笔记
- controller 属性 prototype
- 生产者消费者模型
- 【u-boot】u-boot-2016.09 make编译过程分析(一)
- stm32的VCC/VDD/VSS/VEE
- GPS坐标转换经纬度及换算方法
- codeforces—— 448A —— Rewards
- Android 自定义View (二) 进阶