在Redux存储文件中运行Typescript状态类型不匹配错误

问题描述:

在我看来,我的所有类型都是正确的,但是我错过了另一种 Reducer 类型?

It seems to me that I have all the types correct, however am I missing a different kind of Reducer type?


IinitialAssetsState'不能分配给'Reducer'类型

IinitialAssetsState' is not assignable to type 'Reducer'

完整错误:


输入'(州:{assets:never [];投资组合:never []; loading :boolean;} | undefined,action:any)=> IinitialAssetsState'不能分配给'Reducer'类型。

Type '(state: { assets: never[]; portfolio: never[]; loading: boolean; } | undefined, action: any) => IinitialAssetsState' is not assignable to type 'Reducer'.

参数'state'和'state'的类型是不兼容。

Types of parameters 'state' and 'state' are incompatible.

输入'IinitialAssetsState | undefined'不能赋值给'{assets:never [];组合:从不[]; loading:布尔值; } | undefined'。

Type 'IinitialAssetsState | undefined' is not assignable to type '{ assets: never[]; portfolio: never[]; loading: boolean; } | undefined'.

类型'IinitialAssetsState'不能分配给'{assets:never [];组合:从不[]; loading:布尔值; }'。

Type 'IinitialAssetsState' is not assignable to type '{ assets: never[]; portfolio: never[]; loading: boolean; }'.

属性'资产'的类型不兼容。

Types of property 'assets' are incompatible.

类型'IAsset []'不是可分配给'never []'类型。

Type 'IAsset[]' is not assignable to type 'never[]'.

类型'IAsset'不能分配给'never'类型。

Type 'IAsset' is not assignable to type 'never'.

我的store.ts文件

import { applyMiddleware, createStore, combineReducers } from 'redux'
import { composeWithDevTools } from 'redux-devtools-extension'
import thunkMiddleware from 'redux-thunk'

import { IinitialState } from './shared/types'
import { AssetsReducer } from './reducers/assets'
import { BoardReducer } from './reducers/board'

const rootReducer = combineReducers({
  AssetsReducer,
  BoardReducer
});

export const defaultInitialState = {
  AssetsReducer: { assets: [], loading: false, portfolio: [] },
  BoardReducer: { overlay: false },
}

export function initializeStore(initialState: IinitialState = defaultInitialState) {
  return createStore(
    rootReducer,
    initialState,
    composeWithDevTools(applyMiddleware(thunkMiddleware))
  )
}

AssetsReducer

import { Actions } from '../actions/assets'
import { IinitialAssetsState } from '../shared/types'

const defaultAssetsState = { assets: [], portfolio: [], loading: false };

export const AssetsReducer = (state = defaultAssetsState, action: any): IinitialAssetsState => {
  switch (action.type) {
    case Actions.GET_ALL_ASSETS: {
      const { assets } = action;
      return {
        ...state,
        assets,
        loading: false
      };
    }

    default:
      return state;
  }
};

BoardReducer

import { Actions } from '../actions/board'
import { IinitalBoardState } from '../shared/types'

const defaultBoardState = { overlay: false };

export const BoardReducer = (state = defaultBoardState, action: any): IinitalBoardState => {
  switch (action.type) {
    case Actions.SET_OVERLAY_STATE: {
      const { overlay } = action;
      return {
        overlay
      };
    }

    default:
      return state;
  }
};

我的类型文件

export interface IAsset {
  position: number;
  marketCap: number;
  name: string;
  percentage: number;
  price: number;
  currency: string;
  value: number;
}

export interface IinitialAssetsState {
  assets: IAsset[];
  portfolio: IAsset[];
  loading: boolean;
}

export interface IinitalBoardState {
  overlay: boolean;
}

export interface IinitialState {
  AssetsReducer: IinitialAssetsState;
  BoardReducer: IinitalBoardState;
}



我尝试了什么



我为动作创建了一个类型来删除任何的使用,但我仍然遇到了相同的Typescript错误:

What I've tried

I created a type for the action to remove the use of any, but I still run into the same Typescript error:

interface IAssetsAction {
  type: string;
  assets: IAsset[];
}

export const AssetsReducer = (state = defaultAssetsState, action: IAssetsAction): IinitialAssetsState => {
  console.log('action', action);
  switch (action.type) {
    case Actions.GET_ALL_ASSETS: {
      const { assets } = action;
      return {
        ...state,
        assets,
        loading: false
      };
    }


我相信这可能是 store.ts 中的问题:

I believe this might be the problem in store.ts:

export const defaultInitialState = {
  AssetsReducer: { assets: [], loading: false, portfolio: [] },
  BoardReducer: { overlay: false },
}

此处 defaultInitialState.assets 的类型为never []。

Here defaultInitialState.assets is of type never[].

您需要为设置类型defaultInitialState

export const defaultInitialState : IinitialState  = {
  AssetsReducer: { assets: [], loading: false, portfolio: [] },
  BoardReducer: { overlay: false },
}

编辑:同样在 AssetsReducer BoardReducer

const defaultBoardState:IinitalBoardState = {overlay:false};