美文网首页
使用dva和typescript时dispatch函数的跳转方法

使用dva和typescript时dispatch函数的跳转方法

作者: 平常心 | 来源:发表于2023-08-21 15:48 被阅读0次

    主要用于IDE方法间跳转.
    假设有以下数据结构:

    export type ModelType = {
      namespace: string;
      state: StateType;
      effects: {
        queryProject: Effect;
      };
      reducers: {
        updateToolContentHeight: Reducer<StateType>;
    }
    
    const Model: ModelType = {
      namespace: 'Studio',
      effects: {
        queryProject: Effect;
      };
      reducers: {
        updateToolContentHeight: Reducer<StateType>{}
    }
    
    export const [ALERT_MODEL, ALERT_MODEL_ASYNC] = createModelTypes(AlertModel);
    
    

    跳转方法定义

    interface BaseModeType {['reducers']: {}, ['effects']: {}, ['namespace']: string}
    type MemberType<T extends BaseModeType, U> = U extends 'effects' ? T['effects'] : T['reducers']
    
    function getModelTypes<T extends BaseModeType>(target: T, type: 'effects' | 'reducers'):
        { [K in keyof MemberType<T, typeof type>]: string } {
      const reducers = Object.keys(target[type]).map((obj: string) => [obj, `${target.namespace}/${obj}`]);
      // @ts-ignore
      return Object.fromEntries(new Map<keyof typeof target[type], string>(reducers));
    }
    
    export const createModelTypes = <T extends BaseModeType>(
      target: T
    ): [{ [K in keyof T['reducers']]: string }, { [K in keyof T['effects']]: string }] => {
      return [ getModelTypes(target, 'reducers'), getModelTypes(target, 'effects') ];
    };
    
    

    使用

       dispatch({
          type: ALERT_MODEL.saveTabs,
          payload: { ...props.tabs }
        });
    
    

    跳转方法部分类型处理应该可以进一步优化.

    相关文章

      网友评论

          本文标题:使用dva和typescript时dispatch函数的跳转方法

          本文链接:https://www.haomeiwen.com/subject/agfymdtx.html