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. hive job oom问题

    错误信息例如以下:Container [pid=26845,containerID=container_1419056923480_0212_02_000001] is running beyond ...

  2. 【BZOJ1316】树上的询问 点分治+set

    [BZOJ1316]树上的询问 Description 一棵n个点的带权有根树,有p个询问,每次询问树中是否存在一条长度为Len的路径,如果是,输出Yes否输出No. Input 第一行两个整数n, ...

  3. 最近两周我们接触到的两种线上抓娃娃机的技术实现方案(一种RTSP/一种RTMP)

    线上抓娃娃机需求 最近线上抓娃娃机的项目火爆了,陆陆续续几十款线上抓娃娃机上架,还有一大波正在开发上线中,各大视频云提供商都在蹭热度发布自己的线上抓娃娃机方案,综合了一下,目前线上抓娃娃机的视频需求无 ...

  4. 怎么利用Aspose.Cells 获取excel 数据表中sheet的名称

    说明:开发环境 vs2012 asp.net mvc4 c# 利用Aspose.Cells 获取Excel数据表的sheet的名称,并把获取的名称赋值给easyUI 的combobox 1.运行效果 ...

  5. json字符串转集合或者数组

    import java.util.ArrayList; import java.util.Collection; import java.util.HashMap; import java.util. ...

  6. 一起来学linux:进程

    简单来说,每当执行一个程序或者命令,启动事件的时候都会得到一个PID,也就是进程ID.比如用户登陆的时候就会得到一个PID.如下所示.两个用户zhf和root在登陆后分别获得PID 3212和3214 ...

  7. pyinstaller使用

    python pyinstaller.py [-Fw] ???.py -F 将相关配件(dll.oxc)合成到单个exe文件 -w exe启动时不打开console窗口

  8. 超限学习机 (Extreme Learning Machine, ELM) 学习笔记 (一)

    1. ELM 是什么 ELM的个人理解: 单隐层的前馈人工神经网络,特别之处在于训练权值的算法: 在单隐层的前馈神经网络中,输入层到隐藏层的权值根据某种分布随机赋予,当我们有了输入层到隐藏层的权值之后 ...

  9. linux下更改文件夹名

    mv 旧文件夹名 新文件夹名 mv /usr/bin/python_old /usr/bin/python_new

  10. 前端基础之---css

    css  介绍 css 规则有两个主要的部分构成 : 选择器  , 以及一条或多条声明. 现在的互联网前端分为三层 : ● HTML :超文本标签机语言,从语义的角度描述页面结构. ● CSS : 层 ...