redux

1.redux

在我眼中的redux是一个管理钱财，管理族谱的管家。

2.store

store其实是一个小仓库，要创建这个小仓库需要准备好材料，然后就可以去搭建啦。

import {createStore} from 'redux'
const storage = createStore(reducer)

3.action

 (1) action是一个动作，就是用来传递消息的，我将他当作一只鸽子，普通鸽子可以有很多类型(家鸽）我们需要通过type属性来对消息进行分类,而托付的内容就是鸽子传播的信封payload。

{
  type: 'add_person',
  payload: '耳朵'
}

(2) 武装的鸽子，只需要告诉鸽子托付的内容。

	const ADD_PERSON = 'add_person'
    function addPerson(payload) {
     return {
      type: 'add_person',
      payload,
     }
    }

4.dispatch

  dispatch是一个发送消息的容器，我们可以当作一个消息发送坊，我们把鸽子当作参数放进来就可以发送消息了。

// 发送普通鸽子
store.dispatch({
  type: 'add_person',
  payload: '耳朵'
});
// 发送武装鸽子
store.dispatch(addPerson('耳朵'))

5.reducer

  reducer就是一个接收消息的容器，我们可以当作一个消息接收坊，鸽子的消息就是在此处接收，并且消息接收坊会对消息进行整理然后归类,然后将新的信息进行展示。

const defaultState = [];
const reducer = function (state = defaultState, action) {
   switch (action.type) {
    case 'add_person':
      return [...new Set(action.payload)];
    default: 
      return state;
  }
};

6.subscribe

  suscirbe我把它当作一个窃听器或者内奸(嘿嘿!),当消息一旦被接收和分类处理后，我们想要实时的更新到视图上，我们就需要用到它。
  （对于 React 项目，就是组件的render方法或setState方法）放入listen，就会实现 View 的自动渲染。

listener = ()=>{
    this.setState(store.getState())
}
store.subscribe(listener);