programing

모듈 외부에서 Vuex getter에 액세스할 수 없음

goodcopy 2023. 1. 10. 21:33
반응형

모듈 외부에서 Vuex getter에 액세스할 수 없음

Vue Dev Tools에 getter가 표시되지만 컴포넌트 내 Vuex 모듈 중 하나에서 getter에 액세스할 수 없습니다.

나의store.js파일:

import Vue from 'vue';
import Vuex from 'vuex';
import subsub from './modules/subsub';

Vue.use(Vuex);
export default new Vuex.Store({
  state: { },
  actions: { },
  mutations: { },
  getters: { },
  modules: {
    subsub,
  },
});

나의modules/subsub.js파일:

const state = {
  categories: [{
    name: 'one',
    path: 'two',
    ...
  }, {
    name: 'twocat',
    path: 'two',
    ...
  }],
};

const actions = { };
const mutations = { };
const getters = {
  filterCategories(state) {
    return state.categories;
  },
  filtertwo(state) {
    const filteri = state.categories.filter((catee) => {
      return catee.name === 'twocat';
    });
    return filteri;
  },
};

export default {
  namespaced: true,
  state,
  actions,
  mutations,
  getters,
};

내 컴포넌트:

<template>
  <div> {{ filterCategories }} </div>
</template>

<script>    
import { mapGetters } from 'vuex';

export default {
  computed: {
    ...mapGetters([
      'categories',
      'filtertwo',
      'filterCategories',
    ]),
    filtertwo() {
      return this.$store.getters.filtertwo;
    },
    filterCategories() {
      return this.$store.getters.filterCategories;
    },
  },

</script>

내가 뭘 놓쳤지?모듈에서 getter에 액세스하기 위한 다른 구문이 있습니까?

첫째, 당신은 그 일을 할 사람이 없다.categories를 추가해야 합니다.

둘째, 당신의subsub모듈에는namespaced로 설정된 속성true즉, 모듈 이름을 에 지정해야 합니다.mapGetter도우미:

...mapGetters('subsub', [
  'categories',
  'filtertwo',
  'filterCategories',
]),

셋째,mapGetters함수가 작성하다filtertwo,그리고.filterCategories계산된 속성을 제공합니다.단, 수동으로 재정의하여 명시적으로 참조를 반환하고 있습니다.$store.getters그러나 네임스페이스를 올바르게 참조하고 있지 않기 때문에 네임스페이스를 반환하고 있습니다.undefined. 다음 계산된 속성을 삭제하거나 네임스페이스를 올바르게 참조합니다.

filtertwo() {
  return this.$store.getters['subsub/filtertwo'];
},
filterCategories() {
  return this.$store.getters['subsub/filterCategories'];
},

@thanksd의 힌트에 대한 해결책을 찾았습니다.

namesched가 true로 설정된 위의 예를 사용하여 컴포넌트에 다음 항목을 추가해야 했습니다.

filterCategories() {
      return this.$store.getters['subsub/filterCategories'];
    },

그렇지 않으면 서브서브를 추가하지 않을 경우 이름순서를 false로 설정할 수 있습니다.이 문제는 내가 이해하는데 시간이 좀 걸렸다.건배.

언급URL : https://stackoverflow.com/questions/43766942/cant-access-vuex-getters-outside-of-modules

반응형