DiamondYuan/dva-model-creator

write type strong dva model

Dva Model Creator

Inspired by aikoven/typescript-fsa and dphilipson/typescript-fsa-reducers

If develop JavaScript project,you can use umijs/vscode-extension-umi-pro。

Advantage

• Test coverage 100%, production available.
• Type strong action without any.
• 100% compatible with existing dva projects, can be mixed with the original dva/umi project.

How to use

yarn add dva-model-creator

Config app.ts to prevent namespacePrefixWarning.

export const dva = {
  config: {
    namespacePrefixWarning: false,
    onError(err: ErrorEvent) {
      err.preventDefault();
      console.error(err.message);
    },
  },
};

import { DvaModelBuilder, actionCreatorFactory } from 'dva-model-creator';

const actionCreator = actionCreatorFactory('namespace');
const add = actionCreator<number>('add');
const minus = actionCreator<number>('minus');
const asyncAdd = actionCreator<number>('asyncAdd');
const delay = (timeout) => new Promise((resolve) => setTimeout(resolve, timeout));

interface Counter {
  number: number;
}

const model = new DvaModelBuilder<Counter>({ number: 0 }, 'namespace')
  .case(add, (state, payload) => {
    return {
      number: state.number + payload,
    };
  })
  .case(minus, (state, payload) => {
    return {
      number: state.number - payload,
    };
  })
  .takeEvery(asyncAdd, function* (payload, { call, put }) {
    yield call(delay, 100);
    yield put(add(payload));
  })
  .build();

export default model;

Immer

immer and case cannot be used at the same time, and you should open immer manually.

import { DvaModelBuilder, actionCreatorFactory } from 'dva-model-creator';

const actionCreator = actionCreatorFactory('namespace');
const add = actionCreator<number>('add');
const minus = actionCreator<number>('minus');

interface Counter {
  number: number;
}

const model = new DvaModelBuilder<Counter>({ number: 0 }, 'namespace')
  .immer(add, (state, payload) => {
    state.number += payload;
  })
  .immerWithAction(minus, (state, action) => {
    state.number -= action.payload;
  })
  .build();

export default model;