无法在 vuex 中传递参数 id答案

【问题标题】：Cant pass params id in vuex无法在 vuex 中传递参数 id
【发布时间】：2020-12-12 17:29:56
【问题描述】：

请告诉我在 getter 调用时如何代替 {id} 获取其 id 并将其插入到 vuex 中请求的链接中

行业.js

 import { INDUSTRY } from '@/utils/store/getters.names.js'
        import { FETCH_INDUSTRY } from '@/utils/store/actions.names.js'
        import { SET_INDUSTRY, SET_INDUSTRY_ERROR } from '@/utils/store/mutations.names.js'
        import { API_ENDPOINT } from '@/utils/store/endpoints.js'
        
        export const state = () => ({
          industry: [],
          industryError: false
        })
        
        export const getters = {
          [INDUSTRY]: state => state.industry
        }
        export const actions = {
          [FETCH_INDUSTRY] ({ commit }, id) {
        
            this.$axios.$get(`${API_ENDPOINT}/pages/?child_of=${id}&type=pages.IndustryEquipmentCategoryPage&fields=*`).then((data) => {
              commit(SET_INDUSTRY, data)
            }).catch((e) => {
              commit(SET_INDUSTRY_ERROR)
            })
          }
        }
        
        export const mutations = {
          [SET_INDUSTRY] (state, industry) {
            state.industryError = false
            state.industry = industry
          },
        
          [SET_INDUSTRY_ERROR] (state) {
            state.industry = []
            state.industryError = true
          }
        }

index.js

import { FETCH_MENU, FETCH_SETTINGS, FETCH_INDUSTRY } from '@/utils/store/actions.names.js'

export const state = () => ({})
export const actions = {
  async nuxtServerInit ({ dispatch }) {
    dispatch(`menu/${FETCH_MENU}`)
    dispatch(`settings/${FETCH_SETTINGS}`)
    dispatch(`industry/${FETCH_INDUSTRY}`)
  }
}

actions.names.js

export const FETCH_INDUSTRY = 'fetchIndustry'

getters.names.js

export const INDUSTRY = 'industry'

mutations.names.js

export const SET_INDUSTRY = 'setIndustry'
export const SET_INDUSTRY_ERROR = 'SetIndustryError'

我无法传递 id 来获取 getter 数据。我如何在 getter 中传递参数 id 请告诉我 IndustryEquipmentIndexPage.vue

<template>
  <div class="eqmodel-mainwrap">
    
  </div>
</template>

<script>
import {
  Component,
  Getter,
  Prop,
  Action,
  Mutation,
  Vue,
  mixins,
  Watch
} from "nuxt-property-decorator";
import { PhCaretRight, PhCaretLeft } from "phosphor-vue";
import { INDUSTRY } from "~/utils/store/getters.names";
import { FETCH_INDUSTRY } from "~/utils/store/actions.names";
import { SET_INDUSTRY,SET_INDUSTRY_ERROR } from "~/utils/store/mutations.names";
import { PAGES_ENDPOINT } from "@/utils/store/endpoints.js";
import { gsap, TimelineMax, Power2, Power1, clearProps } from "gsap/all";
import axios from "axios";
import { directive } from "vue-awesome-swiper";

@Component({
  name: "IndustryEquipmentIndexPage",
  components: {
    PhCaretRight,
    PhCaretLeft
  }
})
export default class IndustryEquipmentIndexPage extends Vue {
  @Prop() pageData;
   @Action(FETCH_INDUSTRY) fetchIndustry;
  @Mutation(SET_INDUSTRY) setIndustry;
  @Getter(`industry/${INDUSTRY}`) industry;
   
   
  get HOST() {
    return process.env.HOST;
  }
  
  
}
</script>

【问题讨论】：

你从哪里得到你的身份证？你在哪里可以买到？
我想传递参数 child_of=${id} 来获取 this.$store.dispatch('FETCH_INDUSTRY', { id: this.Pagedata.id }) 但我无法获取数据
你在调用dispatch(FETCH_INDUSTRY)时没有任何负载，所以id在你的操作中将是undefined。

标签： javascript vue.js nuxt.js vuex

【解决方案1】：

根据 Vue 文档，您可以使用 method style access. 做到这一点

    export const getters = {
      [INDUSTRY]: state => (id) => state.industry.find(smthg => smthg.id === id)
    }

【讨论】：