vue.js - 无法在 vuex 中更新购物车商品数量

Question

我一直被困在 vuex 商店，我不知道如何更新购物车项目数量，添加到产品工作正常但是我们将如何更改购物车项目的数量，任何人都可以告诉我，

动作.js

export const updateCart = ({ commit, dispatch }, { product, quantity }) => {
commit('UPDATE_CART', { product, quantity });

Cart.update({ product_id: product.id, 数量 });

}

突变.js

export const UPDATE_CART = (state, { product, quantity }) => {

let productInCart = state.cart.find(item => {
  
    return item.product.id === product.id;
});

if (productInCart) {
    productInCart.quantity += quantity;
    return;
}



state.cart.push({
    product,
    quantity
})

}

购物车.vue

<input class="quantity-spinner" type="text" @keyup="updateCart(item,$event)" :value="item.quantity" name="quantity">
methods: {
goToRoute(name){
        this.$router.push(this.$baseUrl+'/'+name)
    },

...mapActions("cart", [
  "removeProductFromCart",
  "clearCartItems",
  "getCartItems",
  "updateCart"
]),

updateCart(product,e)
{
    this.quantity = e.target.value;

    this.updateCart({
        product:product,
        quantity: parseInt(this.quantity)
    });
}

},

标签： vue.jsvuex

Answer 1

要更新商店，您需要调度操作。

购物车.vue

updateCart(product, e)
{
    this.quantity = parseInt(e.target.value);
    this.$store.dispatch('UPDATE_CART',{ product, quantity: this.quantity })
}