1

我现在有一个简单的减速器和动作类型。在设置我的测试时,我遇到了 type def 问题,返回 mystore引用我的“自定义”操作类型声明。我看到一个错误:

类型 'Store<CombinedState<{ global: GlobalStateShape; }>, SetSelectedAccount >' 不可分配给类型 'Store<any, AnyAction>'。属性“调度”的类型不兼容

我已正确遵循Redux Typescript 文档AFAIK。

为什么SetSelectedAccount我调用时返回combineReducers()globalReducer是处理的动作SetSelectedAccount

在发生上述错误的我的测试设置文件中:

export function createTestStore(isInternal: boolean): Store {
  const store: Store<CombinedState<{
    global: GlobalStateShape;
    }>, SetSelectedAccount> = createStore(rootReducer, { global: 
     getGlobalInitialState(isInternal) });
  return store;
}

src/reducer.ts

export const rootReducer: Reducer<CombinedState<{
    global: GlobalStateShape;
}>, SetSelectedAccount> = combineReducers({
  global: globalReducer,
});

src/store.ts

const composedEnhancer = composeWithDevTools(
  applyMiddleware()
);

export const store: Store<CombinedState<{
  global: GlobalStateShape;
}>, SetSelectedAccount> = createStore(rootReducer, composedEnhancer);

global_reducer.ts:

export const globalReducer = (
  state = GLOBAL_INITIAL_STATE,
  action: GlobalActionTypes
): GlobalStateShape =>
  produce(state, draft => {
    switch (action.type) {
      case GlobalActions.SET_SELECTED_ACCOUNT: {
        draft.selectedAccountId = action.payload.accountId;
        break;
      }
    }
  });

动作.ts

const SET_SELECTED_ACCOUNT = 'SET_SELECTED_ACCOUNT';

export const GlobalActions = {
  SET_SELECTED_ACCOUNT,
};

export interface SetSelectedAccount {
  type: typeof SET_SELECTED_ACCOUNT;
  payload: { accountId: string; selectedApp: AppsList };
}

export type GlobalActionTypes = SetSelectedAccount;

FWIW,如果我添加第二个动作,然后SetSelectedAccount变成上面的返回类型,GlobalActionTypes它是相同的结果和关于不匹配的错误消息dispatch

谢谢!

4

1 回答 1

0

问题

问题是createTestStore函数的返回类型。您创建了一个特定类型的商店(Store<CombinedState<{ global: GlobalStateShape; }>, SetSelectedAccount >),然后您将其返回为Store没有泛型。默认类型StoreStore<any, AnyAction>您在错误消息中看到的类型。

您可能认为这不是问题,因为您的商店更具体,所以它应该可以分配给Store,对吗?但是,当您处理像Dispatch. 返回类型表示您正在返回一个能够调度的商店AnyAction,但实际上您只能调度该类型SetSelectedAccount,因此您的商店不能分配给更广泛的类型。

解决方案

最简单的做法就是完全删除该返回类型: State。您已经输入了store要返回的变量,因此您实际上并不需要它。

您还可以将类型注释从变量移动store到函数返回。仅供参考,reduxCombinedState实用程序类型实际上并没有做任何事情,CombinedState<{ global: GlobalStateShape; }>{ global: GlobalStateShape; }

export function createTestStore(isInternal: boolean): Store<{ global: GlobalStateShape; }, SetSelectedAccount> {
    return createStore(rootReducer, {
        global: getGlobalInitialState(isInternal)
    });
}
于 2020-11-07T02:36:41.237 回答