programing

vuex 작업에 route.params.id 전달

goodsources 2022. 8. 10. 22:23
반응형

vuex 작업에 route.params.id 전달

특정 범주를 클릭할 때 {cat_id} 대신 해당 ID를 가져와서 vuex의 요청이 있는 링크에 삽입하는 방법을 알려주십시오.

<nuxt-link :to="`/products/${category.id}`" class="menu-button">{{ category.title }}</nuxt-link>
export const actions = {
  GET_PRODUCTS({commit}) {
    return axios('https://example.com/api/get-items.php?cat={cat_id}&token=0e94e098eac6e56a22496613b32',{
      method: "GET"
    })
      .then((products) => {
        commit('SET_PRODUCTS', products.data);
        return products;
      })
      .catch((error) => {
        console.log("error")
        return error;
      })
  },
};

액션에 변수를 사용하는 경우 payload로 전달합니다.

this.$store.dispatch('GET_PRODUCTS', { cat: this.$route.params.id })

그리고 당신의 행동에서

async GET_PRODUCTS({ commit }, { cat }) {
  const products = await axios("https://example.com/api/get-items.php", {
    method: "GET",
    params: {
      cat,
      token: "0e94e098eac6e56a22496613b32"
    }
  })
  commit('SET_PRODUCTS', products.data)
  return products
}

언급URL : https://stackoverflow.com/questions/62942091/pass-route-params-id-to-vuex-actions

반응형