programing

변환이 VUEX의 스토어를 업데이트하지 않음

newsource 2023. 6. 14. 21:53

변환이 VUEX의 스토어를 업데이트하지 않음

VUEX로 작업하면서 스토어를 업데이트하려고 하지만 달성하지 못했고, 복잡하지 않은 수치 데이터만 입력하고 싶어 그 이유를 이해할 수 없습니다.변환에 콘솔로 메시지를 입력하면 성공적으로 수신되지만 카트 상태에서는 아무 일도 발생하지 않습니다.

내 코드는 다음과 같습니다.

돌연변이.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를 개체로 사용하여 더 많은 요소에 액세스할 수 있어야 합니다.

매우 중요함

const namespaced = true;  //important!!

export default {
    namespaced,
    state,
    mutations
}

상태:

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

다음과 같은 방법으로 데이터를 입력합니다.

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

안부 전해요

언급URL : https://stackoverflow.com/questions/56437537/mutation-does-not-update-the-store-in-vuex