programing

[Vue.js] Vuex에서의 네임스페이스

prostudy 2022. 6. 4. 08:10
반응형

[Vue.js] Vuex에서의 네임스페이스

모듈의 getter, metations, actions의 네임 스페이스를 설정하려고 합니다.이 문서는 여기서 볼 수 있습니다만, 조금 애매한 것 같습니다.

// types.js

// define names of getters, actions and mutations as constants
// and they are prefixed by the module name `todos`
export const DONE_COUNT = 'todos/DONE_COUNT'
export const FETCH_ALL = 'todos/FETCH_ALL'
export const TOGGLE_DONE = 'todos/TOGGLE_DONE'
// modules/todos.js
import * as types from '../types'

// define getters, actions and mutations using prefixed names
const todosModule = {
  state: { todos: [] },

  getters: {
    [types.DONE_COUNT] (state) {
      // ...
    }
  },

  actions: {
    [types.FETCH_ALL] (context, payload) {
      // ...
    }
  },

  mutations: {
    [types.TOGGLE_DONE] (state, payload) {
      // ...
    }
  }
}

다음으로 vue 컴포넌트에서 모듈화된 getters, mutation을 사용하려면 어떻게 해야 합니까?

export default {
  data() {
    // like this?
    count: this.$store.getters.DONE_COUNT, 
    // ?
    count: this.$store.getters.todos.DONE_COUNT,
    // ?
    count: this.$store.getters.todosModule.DONE_COUNT,
    // ?
    count: ?,
  },
};

this.$store.getters['todos/DONE_COUNT']

언급URL : https://stackoverflow.com/questions/40549997/vue-jsnamespacing-in-vuex

반응형