2.x~3.x改动说明

2.x使用了typescript泛型来约束类型以及做代码提示,定义则通过this.extend(options)来传入

type State = number;
enum TYPE{
  INCREMENT,
  INCREMENT_IF_ODD,
  DECREMENT,
  INCREMENT_ASYNC
};
interface Creators{
  increment(step?: number): { type: string; step: number };
}
interface Selectors{
  count: number;
}
interface Options{
  step?: number;
  getStep?: () => number;
}
export default class MyDuck extends Duck<
  State,
  typeof TYPE,
  Creators,
  Selectors,
  Options
> {
  init() {
    super.init();
    this.extend(
      {
        types: TYPE,
        ...
      }
    );
  }
}

3.x改为了使用getter定义各属性,类型由getter自动生成,对比2.x options定义字段,与3.x getter有以下变动

  • types/typeList(types属性只读,定义由quickTypes及rawTypes替代)

  • initialState(由reducers来处理默认值)

  • reducer(不再支持单reducer,只支持对象形式的reducers)

  • selectors(属性只读,定义由rawSelectors替代)

  • constList(不再支持,请自行定义成员属性)

  • sagas(由saga成员替代)

  • ducks(属性只读,定义由quickDucks及rawDucks替代)

class FooDuck extends Duck {
  get quickTypes() {
    enum Types {
      FOO
    }
    return {
      ...super.quickTypes,
      ...Types
    };
  }
  get rawTypes(){
      return {
          ...super.quickTypes,
          FOOO: 'FOOOO'
      }
  }
  get reducers() {
    const { types } = this;
    return {
      ...super.reducers,

      foo(state = "", action): string {
        switch (action.type) {
          case types.FOO:
            return action.payload;
        }
        return state;
      }
    };
  }
  get creators() {
    return {
      ...super.creators,
      foo() {}
    };
  }
  get rawSelectors() {
    type State = this["State"];
    return {
      ...super.rawSelectors,
      foo(state: State, a: number) {
        return state.foo;
      }
    }
  }

  *saga() {
    yield* super.saga();
    this.types.FOO;
    this.types.FOOO
    this.selector(null).foo;
    this.selectors.foo(null, 1);
  }
}

class FooDuckMap extends DuckMap {
  get reducers() {
    return {
      ...super.reducers,
      foo() {
        return 1;
      }
    };
  }
  get quickDucks() {
    return {
      ...super.quickDucks,
      foo1: FooDuck
    };
  }
  get rawDucks(){
      return {
          ...super.rawDucks,
          foo2: new FooDuck(this.getSubDuckOptions('foo2'))
      }
  }
  *saga() {
    yield* super.saga();
    this.State.foo.toExponential;
    this.State.foo1.foo.toLowerCase;
    this.ducks.foo1.types.FOO;
  }
}

Last updated