无法修改 Redux 中的商店

Question

我允许自己寻求帮助，因为我找不到问题出在哪里，我只想在我的商店中插入/修改数据而不可能，但这不是我第一次...

我的店铺

const initilaState = {
    estimates: [],
    currentEstimate: {
        customer: {},
        products: []
    }

}

将对象添加到产品数组

        case "ADD_PRODUCT_TO_CURRENT_ESTIMATE":

            return {
                estimates: state.estimates,
                currentEstimate: {
                    customer: {},
                    products: [...state.currentEstimate.products, action.payload]
                }
            }

将对象添加到客户对象

        case "ADD_CUSTOMER_CURRENT_ESTIMATE":
            return {
                ...state,
                currentEstimate: {
                    customer: action.payload

                }
            }

不明白为什么，正常情况下空数组是没有问题的

即使我从 reducer 中删除产品并想要添加客户，错误也会消失但状态不会改变。

提前感谢您的帮助:)

--------estimatesreducer------------

const initilaState = {
    estimates: [],
    currentEstimate: {
        customer: {},
        products: []
    }

}

export default function estimatesReducer(state = initilaState, action){
    switch (action.type){
        case "GET_ESTIMATES":
            return {
                estimates: [
                    ...action.payload
                ]
            }

        case "DELETE_ESTIMATE":
            return {
                estimates: state.estimates.filter(estimate => estimate.id !== action.payload)
            }

        case "ADD_PRODUCT_TO_CURRENT_ESTIMATE":

            return {
                ...state,
                estimates: state.estimates,
                currentEstimate: {
                    customer: {},
                    products: [...state.currentEstimate.products, action.payload]
                }
            }

        case "ADD_CUSTOMER_CURRENT_ESTIMATE":
            return {
                ...state,
                currentEstimate: {
                    ...state.currentEstimate,
                    customer: action.payload
                }
            }

/*        case "DELETE_PRODUCT_CURRENT_ESTIMATE" :
            return {
                estimates: state.estimates,
                currentEstimate: {
                    ...state.currentEstimate,
                    products: state.currentEstimate.products.filter(product => product.id !== action.payload)

                }
            }*/

        default:
            return state
    }
}

Answer 1

此操作将从 currentEstimate

中删除您的 product

case "ADD_CUSTOMER_CURRENT_ESTIMATE":
            return {
                ...state,
                currentEstimate: {
                    customer: action.payload

                }
            }

你一定不要忘记在 reducer 上设置之前的状态

case "ADD_CUSTOMER_CURRENT_ESTIMATE":
        return {
            ...state,
            currentEstimate: {
                ...state.currentEstimate
                customer: action.payload
            }
        }

您还忘记了 return 在您的第一个动作中的状态

case "ADD_PRODUCT_TO_CURRENT_ESTIMATE":

        return {
            ...state
            estimates: state.estimates,
            currentEstimate: {
                customer: {},
                products: [...state.currentEstimate.products, action.payload]
            }
        }

UPD：您有 2 个操作可从状态中删除 currentEstimate - GET_ESTIMATES 和 DELETE_ESTIMATE，因此当您之后调用 ADD_PRODUCT_TO_CURRENT_ESTIMATE 时，您会收到错误消息

无法修改 Redux 中的商店

cannot modify the store in Redux

javascript

reactjs

redux

react-redux

reducers