createStore(reducer, [initialState])

创建一个 Redux store 来以存放应用中所有的 state。
应用中应有且仅有一个 store。

参数

  1. reducer (Function): 接收两个参数,分别是当前的 state 树和要处理的 action,返回新的 state 树。

  2. [initialState(any): 初始时的 state。 在同构应用中,你可以决定是否把服务端传来的 state 水合(hydrate)后传给它,或者从之前保存的用户会话中恢复一个传给它。如果你使用 combineReducers创建 reducer,它必须是一个普通对象,与传入的 keys 保持同样的结构。否则,你可以自由传入任何reducer 可理解的内容。

返回值

(Store): 保存了应用所有 state 的对象。改变 state 的惟一方法是 dispatch action。你也可以 subscribe 监听 state 的变化,然后更新 UI。

 import { createStore } from 'redux'

 function todos(state = [], action) {
switch (action.type) {
case 'ADD_TODO':
return state.concat([ action.text ])
default:
return state
}
} let store = createStore(todos, [ 'Use Redux' ]) store.dispatch({
type: 'ADD_TODO',
text: 'Read the docs'
}) console.log(store.getState())
// [ 'Use Redux', 'Read the docs' ]

小贴士

  • 应用中不要创建多个 store!相反,使用 combineReducers 来把多个 reducer 创建成一个根 reducer。

  • 你可以决定 state 的格式。你可以使用普通对象或者 Immutable 这类的实现。如果你不知道如何做,刚开始可以使用普通对象。

  • 如果 state 是普通对象,永远不要修改它!比如,reducer 里不要使用 Object.assign(state,newData),应该使用 Object.assign({}, state, newData)。这样才不会覆盖旧的 state。也可以使用Babel 阶段 1 中的 ES7 对象的 spread 操作 特性中的 return { ...state, ...newData }

  • 对于服务端运行的同构应用,为每一个请求创建一个 store 实例,以此让 store 相隔离。dispatch 一系列请求数据的 action 到 store 实例上,等待请求完成后再在服务端渲染应用。

  • 当 store 创建后,Redux 会 dispatch 一个 action 到 reducer 上,来用初始的 state 来填充 store。你不需要处理这个 action。但要记住,如果第一个参数也就是传入的 state 如果是 undefined 的话,reducer 应该返回初始的 state 值。

Redux API之creatStore的更多相关文章

  1. Redux API

    Redux API ​ Redux的API非常少.Redux定义了一系列的约定(contract),同时提供少量辅助函数来把这些约定整合到一起. ​ Redux只关心如何管理state.在实际的项目中 ...

  2. Redux API之applyMiddleware

    applyMiddleware(...middlewares) 使用包含自定义功能的 middleware 来扩展 Redux 是一种推荐的方式.Middleware 可以让你包装 store 的di ...

  3. Redux API之Store

    Store Store 就是用来维持应用所有的 state 树 的一个对象. 改变 store 内 state 的惟一途径是对它 dispatch 一个action. Store 不是类.它只是有几个 ...

  4. React深入 - 手写redux api

    简介: 手写实现redux基础api createStore( )和store相关方法 api回顾: createStore(reducer, [preloadedState], enhancer) ...

  5. Redux API之bindActionCreators

    bindActionCreators(actionCreators,dispatch) 把 action creators 转成拥有同名 keys 的对象,但使用 dispatch 把每个 actio ...

  6. Redux API之compose

    compose(...functions) 从右到左来组合多个函数. 这是函数式编程中的方法,为了方便,被放到了 Redux 里. 当需要把多个 store 增强器 依次执行的时候,需要用到它. 参数 ...

  7. Redux API之combineReducers

    combineReducers(reducers) 随着应用变得复杂,需要对 reducer 函数 进行拆分,拆分后的每一块独立负责管理 state 的一部分. combineReducers 辅助函 ...

  8. Redux基础

    Redux 是一个状态容器 Redux 就像是作者自己的介绍,它不会为你提供任何的东西,它不会告诉你如何做路由,它只专注于应用程序状态,是一个 JavasSript 的状态容器,所有的状态的变化都是当 ...

  9. React+Redux学习笔记:React+Redux简易开发步骤

    前言 React+Redux 分为两部分: UI组件:即React组件,也叫用户自定义UI组件,用于渲染DOM 容器组件:即Redux逻辑,处理数据和业务逻辑,支持所有Redux API,参考之前的文 ...

随机推荐

  1. 【转】android 签名验证防止重打包

    网上资料很多,这里只做一个笔记反编译 dex 修改重新打包签名后 apk 的签名信息肯定会改变,所以可以在代码中判断签名信息是否被改变过,如果签名不一致就退出程序,以防止 apk 被重新打包. 1 j ...

  2. l两张图片轮播

    在head里面加 <script language="javascript"> function scroll(spanlevel) { if (spanlevel.s ...

  3. mvc 各种返回值

    一个例子胜过千言万语,直接上代码 SpringMVC的Controller控制器返回值详解 SpringMVC Controller 返回值几种类型 Spring MVC 更灵活的控制 json 返回 ...

  4. myeclipse中disable maven nature怎么恢复

    eclipse更新maven的时候,不小心手一抖,点上了Disable Maven Nature,然后工程右键菜单中的Maven栏就不见了! 其实这是把maven工程转换成了一般工程,再转回来就好了. ...

  5. Angular入门(二) 服务

    目的:为了不再把相同的代码复制一遍又一遍,我们要创建一个单一的可复用的数据服务,并且把它注入到需要它的那些组件中. ※  文件命名约定:服务名称的小写形式(基本名),加上.service后缀,如果服务 ...

  6. about gnu bash shell

    1 定义字符串不需要引号 var=NONE echo $var ==>NONE 2 支持基本的整数计算 a=1 b=2 echo $((a+b)) ==>3 必须用$(()),双括号的形式 ...

  7. Jaccard Similarity and Shingling

    https://www.cs.utah.edu/~jeffp/teaching/cs5955/L4-Jaccard+Shingle.pdf https://www.cs.utah.edu/~jeffp ...

  8. 性能测试--yslow

    YSlow YSlow可以对网站的页面进行分析,并告诉你为了提高网站性能,如何基于某些规则而进行优化. YSlow可以分析任何网站,并为每一个规则产生一个整体报告,如果页面可以进行优化,则YSlow会 ...

  9. 我的Android进阶之旅------>Android通过使用Matrix旋转图片来模拟碟片加载过程

    今天实现了一个模拟碟片加载过程的小demo,在此展示一下.由于在公司,不好截取动态图片,因此就在这截取两张静态图片看看效果先. 下面简单的将代码列出来. setp1.准备两张用于旋转的图片,如下:lo ...

  10. Flask:基本结构

    python有两个比较出名的网络框架,一个是django,一个是flask. 之前的django文章里面介绍了django的各种用法,这个系列开始介绍flask的用法.相比与django,flask更 ...