Redux 使用

• 通过reducer新建store，随时通过store.getState获取状态

• 需要状态变更，store.dispatch(action)来修改状态

• reducer函数接受state和action，🔙返回🆕新的state，可以用store.subscribe监听每次修改

index.js

import {createStore} from 'redux'

function counter(state=0,action) {
  switch (action.type) {
    case 'add':
      return state+1;
    case 'reduce':
      return state-1;
    default:
      return 10
  }
}

//新建store
const store = createStore(counter);
const init = store.getState();
console.log(init);

//监听
function listener() {
  const current = store.getState();
  console.log(`现在有的${current}`);
}
store.subscribe(listener)

//派发事件 传递aciton
store.dispatch({type:'add'});
store.dispatch({type:'reduce'});
store.dispatch({type:'add'});
store.dispatch({type:'add'});

Action

action 内必须使用一个字符串类型的type字段来表示将要执行的动作。多数情况下，type会被定义成字符串常量。当应用规模越来越大时，建议使用单独的模块或文件来存放 action。

Action创建函数

Action 创建函数就是生成 action 的方法。

// action creator

export function add() {
  return {type:ADD};
};
export function reduce() {
  return {type:REDUCE};
};