首页 > 解决方案 > NgRx 的“类型”问题不能分配给“状态”类型

问题描述

我的“类型”有问题,会出现以下错误。我尝试更改类型,但仍然没有用。

我有一个初始状态,它具有三种不同的类型。

todo.reducer 属于 Todo 组件,我已经为整个应用程序声明了一个 Main reducer。

错误

输入'{错误:字符串;项目:待办事项列表[];加载:布尔值;}' 不可分配给类型 'State'。属性“错误”的类型不兼容。类型“字符串”不可分配给类型“错误”。

**todo.reducer.ts:**

export interface State{
    items:TodoList[],
    loading:boolean,
    error:Error
}

const initialState:State={
    items:[
        new TodoList(1,'cook'),
        new TodoList(2,'work')
    ],
    loading:false,
    error:undefined

}

export function TodoItem(state=initialState,action:TodoActions.TodoActions){

    switch(action.type){

        case TodoActions.ADD_ITEM:
            return {
                ...state,
                loading:true

            }
        case TodoActions.DELETE_ITEM:
            return {
                ...state,
                loading:true
            }
        case TodoActions.LOADING_LIST:
            return{
                ...state,
                loading:true
            }
        case TodoActions.LOADING_LIST_SUCCESS:
            return{
                ...state,
                loading:false
            }
        case TodoActions.LOADING_LIST_FAIL:
            return {
                ...state,
                loading:false
            }
        case TodoActions.ADD_ITEM_SUCCESS:
            return{
                ...state,
                items:[...state.items,action.payload],
                loading:false
            }
        case TodoActions.ADD_ITEM_FAILURE:
            return{
                ...state,
                error:action.payload
            }
        case TodoActions.DELETE_ITEM_SUCCESS:
            return{
                ...state,
                items:state.items.filter((items)=>{
                    return items.id!==action.payload
                }),
                loading:false

            }
        case TodoActions.DELETE_ITEM_FAILURE:
            return{
                ...state,
                error:action.payload,
                loading:false
            }
        default:
            return state;

    }



**app.reducer.ts:**

export interface AppState{

    list:fromTodoReducer.State

}

export const appReducer:ActionReducerMap<AppState>={
    list:fromTodoReducer.TodoItem
}

标签: angularngrxngrx-storengrx-effects

解决方案


推荐阅读