Nuxt store getter가 작동하지 않습니다. 페이로드에 지정된 ID가 Integer + Error가 아닙니다. [vuex] 변환 핸들러 외부의 vuex 스토어 상태를 변환하지 마십시오.

Nuxt store getter가 작동하지 않습니다. 페이로드에 지정된 ID가 Integer + Error가 아닙니다. [vuex] 변환 핸들러 외부의 vuex 스토어 상태를 변환하지 마십시오.

상품 상세 페이지를 만들려고 합니다.상세 페이지의 이름은 _id 입니다.열면 ID가 제품 ID로 바뀝니다.페이지를 열면 API에서 가져온 데이터로 상태가 설정됩니다.

그 후 getProduct()라는 이름의 getter를 참조하는 계산된 속성을 ID로 사용하려고 합니다.this.$route.params.id)를 사용합니다.

제 _id는 이렇습니다.vue는 다음과 같습니다.

methods: {
  ...mapActions("products", ["fetchProducts",]),
  ...mapGetters("products", ["getProduct",]),
},
async mounted() {
  this.fetchProducts()
},
computed: {
  product() {
    return this.getProduct(this.$route.params.id)
  }
}

products.js라는 이름의 스토어 파일은 다음과 같습니다.

import axios from "axios"

export const state = () => ({
  producten: []
})

export const mutations = {
  setProducts(state, data) {
    state.producten = data
  }
}

export const getters = {
  getProduct(state, id) {
    console.log(id)
    return state.producten.filter(product => product.id = id)
  }
}

export const actions = {
  async fetchProducts({ commit }) {
    await axios.get('/api/products')
      .then(res => {
        var data = res.data
        commit('setProducts', data)
      })
      .catch(err => console.log(err));
  }
}

작동하는 것은 국가를 만드는 것이지만, 제가 getter를 사용하려고 하면 뭔가 잘못됩니다.보시는 바와 같이 i console.log()에 지정된 ID입니다.그러면 다음 로그가 기록됩니다.

또한 client.js?06a0:103 오류: [vuex] 변환 핸들러 외부에 있는 vuex 스토어 상태를 변환하지 않습니다.

내가 아는 한 안 하는 게 뭐야?

**주의: ** 이러한 오류는 상태 어레이의 길이만큼 기록됩니다.

그 Vuex 문서에서:

Vuex 우리 가게에서"getters"을 정의할 수 있다.그들을 상점에 계산된 속성으로 생각할 수 있다.computed 속성처럼, 흡착제의 결과물은 그 상이함에 근거하고 일부 의존성은 변했습니다만 재평가할 캐시 됩니다.

맘에 들다computed,getters인수를 하고를 지원하지 않습니다.

하지만 방법은 흡착제에"접근method-style"것이 있습니다:https://vuex.vuejs.org/guide/getters.html#property-style-access.

또한 getters에 함수적으로 인수 전달할 수 있다.너는 가게의 배열을 쿼리 하고 싶어 하기 때문 특히:유용하다.

getters: {
  // ...
  getTodoById: (state) => (id) => {
    return state.todos.find(todo => todo.id === id)
  }
}

store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }

참고로 getters 방법을 통해에 액세스 하라고 할 때마다 실행할 것이며, 이 결과는 캐시에 저장되지 않다.

언급URL:https://stackoverflow.com/questions/70336706/nuxt-store-getter-not-working-id-given-to-payload-is-not-an-integer-error-v