javascript - Vuex:我怎样才能更新这个对象的唯一元素？

Question

在其他堆栈溢出问题的帮助下，我已经走到这一步了。 基本上，它返回更新单个 id 的新数组。 但是我的 store state 没有更新，为什么？ 这是我的 state 对象:

allProducts:[
            {
                "product_name": '',
                "code": '',
                "id": ''

            }
        ],

这是我的突变。

UPDATE_PRODUCT : ({allProducts},payload) =>{
            let updatedProducts = allProducts.map(product => {
                if(product.id === payload.id){
                    return Object.assign({}, product, payload);
                }
                return product;
            })
            allProducts = updatedProducts;
        }

如果我 console.log(updatedProducts)，我会得到非常好的 result。但是我的 allProducts 没有更新。

Answer 1

您缺少 state 作为变异方法中的第一个参数:

state:{
    allProducts:[
        {
            "product_name": '',
            "code": '',
            "id": ''

        }
    ]  
}

和突变:

 UPDATE_PRODUCT : (state,payload) =>{
        let updatedProducts = state.allProducts.map(product => {
            if(product.id === payload.id){
                return Object.assign({}, product, payload);
            }
            return product;
        })
        state.allProducts = updatedProducts.slice();
    }