IT이야기

vuex: 알 수 없는 getter: 기사

cyworld 2022. 7. 12. 21:46
반응형

vuex: 알 수 없는 getter: 기사

구현하려고 합니다.vuex모듈 및 사용법에 대해 설명합니다.내 모듈 Import 시도 중home.vue다음과 같은 해결책을 찾았습니다.

import { FETCH_INDEX_ARTICLES } from "@/store/types/actions.type.js";
// imports this => export const FETCH_INDEX_ARTICLES = "fetchIndexArticles"
import { mapGetters, mapActions} from 'vuex'
export default {
  name: "Home",
  data() {
      return {}
  },
  computed: {
      ...mapGetters(['articles']),
    },
  methods: {
      ...mapActions([FETCH_INDEX_ARTICLES])
  }
  created() {
      this.$store.dispatch(FETCH_INDEX_ARTICLES);
  }
};

하지만 대신 나는

vuex.esm.js?2f62:438 [vuex] unknown action type: fetchIndexArticles
vuex.esm.js?2f62:950 [vuex] unknown getter: articles

store/index.displaces

export default new Vuex.Store({
  modules: {
    articles,
  }
});

store/module/module.module.models

const state = {
  articles: [],

};
const getters = {
  articles(state) {
    return state.articles;
  },
};
const mutations = {
  [SET_ARTICLES] (state, pArticles) {
    state.article = pArticles
    state.errors = {}
  }
}
const actions = {
  [FETCH_INDEX_ARTICLES] (context) {
    context.commit(FETCH_START)
    return ApiService
      .get('/articlelist/index/')
      .then((data) => {
        context.commit(SET_ARTICLES, data.articles);
        context.commit(FETCH_END)
      })
      .catch((response) => {
        context.commit(SET_ERROR, response.data.errors);
      })
    }
};
export default {
  namespaced: true,
  state,
  getters,
  actions,
  mutations
}

vuex 모듈을 올바르게 Import하려면 어떻게 해야 합니까?

고마워요.

모듈을 지정해야 합니다. 모듈을 컴포넌트로 직접 Import할 때 방법이 유효합니다.

...mapGetters('articles', {
    article: 'articles',
})

this.article(2)

https://vuex.vuejs.org/guide/modules.html#binding-helpers-with-namespace

사용을 용이하게 하기 위해 나는 그 방법을 사용한다.dispatch액션을 위해서

this.$store.dispatch('articles/FETCH_INDEX_ARTICLES', {anydata})

언급URL : https://stackoverflow.com/questions/61732170/vuex-unknown-getter-articles

반응형