在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};