关于redux

Posted by VickyWu on August 10, 2017

关于redux

设计原则

1.唯一数据源 2.状态只读 3.数据改变只能通过纯函数完成(即reducer为纯函数)

基本概念

1.store Store 就是保存数据的地方,你可以把它看成一个容器。整个应用只能有一个 Store。 Redux 提供createStore这个函数,用来生成 Store。

import { createStore } from 'redux';
const store = createStore(fn);

2.state Store对象包含所有数据。如果想得到某个时点的数据,就要对 Store 生成快照。这种时点的数据集合,就叫做 State。 当前时刻的 State,可以通过store.getState()拿到。

import { createStore } from 'redux';
const store = createStore(fn);

const state = store.getState();

Redux 规定, 一个 State 对应一个 View。只要 State 相同,View 就相同。 3.action Action 是一个对象。用于view发出通知,表示state要发生变化。其中的type属性是必须的,表示 Action 的名称。其他属性可以自由设置。

const action = {
  type: 'ADD_TODO',
  payload: 'Learn Redux'
};

基本操作

此处输入图片的描述

注意

1.按照功能组织代码 此处输入图片的描述 2.保持state范式化 此处输入图片的描述 3.保持state扁平化 此处输入图片的描述 4.用selector读state 此处输入图片的描述 此处输入图片的描述 5.分离容器组件和傻瓜组件 此处输入图片的描述 6.使用react-redux

7.标准化action 此处输入图片的描述 8.使用creator创建action creator

export const createActionCreator = (type, payload) => {
    return (...args) => ({
        payload: (typeof payload === 'function') ? payload(...args) : payload,
        type: type,
    });
};

9.使用函数创造reducer 此处输入图片的描述 此处输入图片的描述 10.使用redux-immutable-addons 11.使用合适的异步处理方式