mini-redux

搜索文档…
mini-redux
说明
以最简单的方式实现核心 redux
源码
​https://github.com/ddzy/ts-utility-plugins/tree/master/src/ddzy/utility/algorithm/mini-redux​
用法
miniRedux.test.ts
import createStore from '../../utility/algorithm/mini-redux/index';
​
describe('MiniRedux', () => {
  interface IStaticState {
    count: number;
  };
  interface IStaticAction {
    type: string;
  };
​
  const initialState: IStaticState = {
    count: 0,
  };
  const reducer = (state: IStaticState, action: IStaticAction) => {
    switch (action.type) {
      case 'INCREMENT': {
        return {
          ...state,
          count: ++state.count,
        };
      };
      case 'DECREMENT': {
        return {
          ...state,
          count: --state.count,
        };
      };
      default: {
        return state
      };
    }
  }
  const store = createStore<IStaticState, IStaticAction>(reducer, initialState);
​
  test('The method `store.getState()` should work fine', () => {
    const state = store.getState();
​
    expect(state.count).toBe(0);
  });
  test('The method `store.dispatch()` should work fine`', () => {
    store.dispatch({
      type: 'INCREMENT',
    });
    store.dispatch({
      type: 'INCREMENT',
    });
    store.dispatch({
      type: 'INCREMENT',
    });
    store.dispatch({
      type: 'DECREMENT',
    });
​
    expect(store.getState().count).toBe(2);
  });
  test('The method `store.subscribe()` should work fine', () => {
    let index = 0;
​
    store.subscribe(() => {
      ++index;
    });
    store.dispatch({
      type: 'DECREMENT',
    });
    store.dispatch({
      type: 'DECREMENT',
    });
​
    expect(index).toBe(2);
    expect(store.getState().count).toBe(0);
  });
});
API
Name
Type
Description
createStore
function
创建 store
dispatch
function
触发修改动作
getState
function
获取 state 数据
subscribe
function
监听 state 变化, 执行钩子函数
以前
event-emitter
下一个
url-search-params
最近更新 1yr ago
复制链接
大纲