Mutation 不会更新 VUEX 中的 store [英] Mutation does not update the store in VUEX
本文介绍了Mutation 不会更新 VUEX 中的 store的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
使用 VUEX 我正在尝试更新商店,但我没有实现,我不明白原因,因为我只想输入数字数据而没有任何复杂性.在突变中,通过控制台输入消息,然后我收到它们成功,但在购物车状态下没有任何反应.
Working with VUEX I am trying to update the store but I do not achieve it, I do not understand the reason since I only want to enter a numerical data without any complications.In the mutation enter messages by console and I receive them successfully but nothing happens in the state of cart.
这是我的代码:
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;
}
}
推荐答案
解决了,必须使用VUEX作为对象才能访问更多元素:
Solved, we must use VUEX as an object to be able to access more elements:
非常重要
const namespaced = true; //important!!
export default {
namespaced,
state,
mutations
}
状态:
export default {
cart: {
products: [],
shipping : ''
}
}
并以这种方式输入您的数据:
And enter your data in this way:
computed: {
...mapState( 'cart', ['cart', 'products', 'shipping'] ),
问候
这篇关于Mutation 不会更新 VUEX 中的 store的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文