首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >无法在vuex中传递参数id

无法在vuex中传递参数id
EN

Stack Overflow用户
提问于 2020-12-13 01:29:57
回答 1查看 54关注 0票数 0

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

industry.js

代码语言:javascript
复制
 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

代码语言:javascript
复制
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

代码语言:javascript
复制
export const FETCH_INDUSTRY = 'fetchIndustry'

getters.names.js

代码语言:javascript
复制
export const INDUSTRY = 'industry'

mutations.names.js

代码语言:javascript
复制
export const SET_INDUSTRY = 'setIndustry'
export const SET_INDUSTRY_ERROR = 'SetIndustryError'

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

代码语言:javascript
复制
<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>
EN

回答 1

Stack Overflow用户

发布于 2020-12-13 02:59:32

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

代码语言:javascript
复制
    export const getters = {
      [INDUSTRY]: state => (id) => state.industry.find(smthg => smthg.id === id)
    }
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/65267825

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档