Vuex: Как я могу обновить единственный элемент из этого объекта?

Question

С помощью других вопросов о переполнении стека я так далеко. По сути, он возвращает новый массив, обновляющий один идентификатор. Но мой store state не обновляется, почему? Это мой state объект:

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

            }
        ],

А это мой mutation.

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

вы заменяете ссылку здесь, теряя оригинальную

allProducts = updatedProducts;

вместо этого вы должны изменить его

allProducts.length = 0;
Array.prototype.push.apply(allProducts, updatedProducts);

Answer 2

Вам не хватает 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();
    }