类型 'string' 不可分配给类型 'undefined' 错误 React/Redux initialState

Type 'string' is not assignable to type 'undefined' error on React/Redux initialState

我收到 lint 错误 Type 'string' is not assignable to type 'undefined' on my创建商店时的 initialState,我正在努力解决它。

以下是相关部分的简化表示:

export interface IGeneric {
  aString: string;
  aNumber: number;
}

interface IAppState {
  currentSection: string;
  experiences: IGeneric[] | [];
  finishedScenario: boolean;
  formation: IGeneric[] | [];
  language: LanguageCode;
  languages: IGeneric[] | [];
  projects: IGeneric[] | [];
  skills: IGeneric[] | [];
  texts: IGeneric | Record<string, never>;
  textsDatabase: IGeneric | Record<string, never>;
}

const INITIAL_STATE: IAppState = {
  currentSection: 'main',
  experiences: [],
  finishedScenario: false,
  formation: [],
  language: 'en',
  languages: [],
  projects: [],
  skills: [],
  texts: {},
  textsDatabase: {}
};


let store: Store;

export const getStore = (): Store<IAppState> => {
  if (!store) {
    store = createStore(
      rootReducer,
      INITIAL_STATE, // error here
      compose(applyMiddleware(thunk, updateTexts), devToolsEnhancer())
    );
  }
  return store;
};

关于如何解决它的任何想法? 谢谢!

更新:

似乎在我的 combineReducers 中,我的所有状态值都默认初始化为 undefined,根据 Redux 定义,all reducers are passed undefined on initialization 那么好吧。我明白了那部分……但问题仍然存在……如何应对它并使我的 createStore 接受其初始状态的未定义接口和真实接口?

您没有将第一个道具的收盘价放在初始状态中。您的初始状态应该:

const INITIAL_STATE: IAppState = {
  currentSection: 'main',
  ....
};

好的...经过艰苦奋斗并阅读了数以千计的文档后,我找到了解决方案。我post就在这里,希望以后对别人有帮助。

真正让我大开眼界的是this Github issue and 。 我缺少的是:

"With combineReducers, each slice reducer is expected to "own" its slice of state. That means providing an initial value in case the current slice is undefined, and combineReducers will point out if you're not doing that."

"Your reducers currently do nothing except return whatever's passed in. That means that if state is undefined, they will return undefined. So, combineReducers() is telling you you're breaking the result that it expects."

因此,很明显我的问题发生在我的 conbineReducers 上,我重写了它的类型定义以允许未定义的值。

这是它的最终实现(为简化起见,IGeneric 更改了实际接口):

type IActionReducer<T> = (state: T, action: IAction<T>) => T;

interface RootReducer {
  currentSection: IActionReducer<IGeneric| undefined>;
  experiences: IActionReducer<IGeneric[] | [] | undefined>;
  finishedScenario: IActionReducer<boolean | undefined>;
  formation: IActionReducer<IGeneric[] | [] | undefined>;
  language: IActionReducer<IGeneric| undefined>;
  languages: IActionReducer<IGeneric[] | [] | undefined>;
  projects: IActionReducer<IGeneric[] | [] | undefined>;
  skills: IActionReducer<IGeneric[] | [] | undefined>;
  texts: IActionReducer<IGeneric| Record<string, never> | undefined>;
  textsDatabase: IActionReducer<IGeneric| Record<string, never> | undefined>;
}

const rootReducer = combineReducers({
  currentSection,
  experiences,
  finishedScenario,
  formation,
  language,
  languages,
  projects,
  skills,
  texts,
  textsDatabase
} as RootReducer);

export default rootReducer;

我真的希望这对遇到类似问题的人有所帮助。 :)