Reducer自定义调度类型，不可分配，属性“调度”类型不兼容

如何解决Reducer自定义调度类型，不可分配，属性“调度”类型不兼容

我现在有一个简单的reducer和action类型。设置测试时，我遇到了类型定义问题，并返回了SetSelectedAccount以引用我的“自定义”操作类型声明。我看到一个错误：

类型“ Store ，无法分配SetSelectedAccount>，以键入“ Store ”。 属性“ dispatch”的类型不兼容

我正确遵循了Redux Typescript docs AFAIK。

为什么调用combineReducers()时会返回globalReducer？ SetSelectedAccount正在处理export function createTestStore(isInternal: boolean): Store { const store: Store<CombinedState<{ global: GlobalStateShape; }>,SetSelectedAccount> = createStore(rootReducer,{ global: getGlobalInitialState(isInternal) }); return store; } 的动作。

在我的测试设置文件发生上述错误的位置：

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

src / reducer.ts

const composedEnhancer = composeWithDevTools(
  applyMiddleware()
);

export const store: Store<CombinedState<{
  global: GlobalStateShape;
}>,composedEnhancer);

src / store.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;
      }
    }
  });

global_reducer.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;

actions.ts

SetSelectedAccount

---

FWIW，如果我添加第二个动作，那么GlobalActionTypes会变成dispatch上方的返回类型，这与关于#!/usr/bin/env bash array=() string="/packages/frontend/react-app/src/index.ts" [[ $string =~ packages/([^/]+/){2} ]] && array+=("${BASH_REMATCH[0]}") 不匹配的结果和错误消息相同。

谢谢！

解决方法

问题

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

您可能会认为这不是问题，因为您的商店更加具体，因此应该将其分配给Store，对吗？但是，当您处理诸如Dispatch之类的函数参数时，特异性会倒退。返回类型表示您要返回的商店可以分派AnyAction，但实际上您只能分派类型SetSelectedAccount，因此您的商店无法分配给更广泛的类型。 / p>

解决方案

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

您还可以将类型注释从变量store移至函数return。仅供参考，redux CombinedState实用程序类型实际上什么也没做，CombinedState<{ global: GlobalStateShape; }>与{ global: GlobalStateShape; }相同

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