Question

与VUEX一起工作我正在尝试更新商店，但是我没有实现，我不明白原因，因为我只想输入没有任何复杂性的数字数据。在变异中，通过控制台输入消息，我收到了它们成功，但是在购物车状态下什么也没发生。

这是我的代码：

Mutations.js

export function shipping(state, cost) {
    state.cart.shipping = cost;
    console.log(cost);
    console.log('hello from mutation');
}

模板：

<input type="number" name="cost" :value="shippingCost" @input="updateCost">

方法

...mapMutations('cart', ['addProductToCart', 'subtractProductToCart', 'removeProductFromCart', 'removeAllProducts', 'shipping' ]),

    updateCost(event) {
      this.$store.commit('cart/shipping', event.target.value)
    },

计算

computed: {
   ...mapState( 'cart', ['cart'] ),
   ...mapGetters('cart', ['totalItems', 'totalCost']),
   ...mapGetters('cart', ['shippingCost']),

  shippingCost() {
    return this.$store.getters.shippingCost;
  }
}

Answer 1

解决了，我们必须使用VUEX作为对象才能访问更多元素：

非常重要

const namespaced = true;  //important!!

export default {
    namespaced,
    state,
    mutations
}

状态：

export default {
    cart: {
        products: [], 
        shipping : ''
    }
}

并以这种方式输入数据：

computed: {
   ...mapState( 'cart', ['cart', 'products', 'shipping'] ),

致谢

突变不会更新VUEX中的商店

1 个答案: