반응형
vuex 모듈에서 getter를 정의하는 방법
vuex 모듈을 개선하려고 하지만 다음과 같은 오류가 발생합니다.
Uncaught Error: [vuex] getters should be function but "getters.getComments" in module "comments" is [].
/stores/syslog.displays(표준)
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const state = {
comments: []
}
const getters = {
getComments: state => state.comments
}
const mutations = {
setComments(state, comments) {
state.comments = comments
}
}
const actions = {
setComments(context, data) {
context.commit('setComments', data)
}
}
export default new Vuex.Store({
state,
getters,
mutations,
actions
})
여기 vuex 스토어의 루트 상태를 포함한 my store.displays가 있습니다.
import Vue from 'vue';
import Vuex from 'vuex';
import commentsModule from './stores/comments'
Vue.use(Vuex);
const state = {
}
const getters = {
}
const mutations = {
}
const actions = {
}
export default new Vuex.Store({
state,
getters,
mutations,
modules: {
comments: commentsModule
},
actions
})
이 문제를 해결할 수 있도록 도와주실 수 있나요?시도했지만 무엇이 문제인지 이해하지 못했다.
- 작성 중
store
에 대한 인스턴스store.js
어느쪽이 좋은가 - 다른 파일을 만들고 있습니다.
store
내부 인스턴스comment.js
좋지 않다
먼저 내보내기 블록 변경 시도:comment.js
다음과 같이 입력합니다.
export default {
state,
getters,
mutations,
actions
}
보다 모듈러적인 방법으로 시험해 보세요).
외부 모듈로 게터를 이동합니다.
예를 들면app/js/store/getters.js
:
export const getComments = state => {
return state.comments;
};
그리고 그 안에app/js/store/index.js
예를 들어 다음과 같습니다.
import Vue from 'vue';
import Vuex from 'vuex';
import * as getters from './getters';
Vue.use(Vuex);
export default new Vuex.Store({
state: {
comments: [],
},
getters,
// ...
});
언급URL : https://stackoverflow.com/questions/46999565/how-to-define-getters-on-vuex-module
반응형
'programing' 카테고리의 다른 글
vuejs 앱에서 실행할 때 Axios 응답 헤더에 데이터가 누락됨 (0) | 2022.07.21 |
---|---|
사용자 로그 vue.js의 이름을 유지하려면 어떻게 해야 합니까? (0) | 2022.07.21 |
특정 Array List 항목을 가져옵니다. (0) | 2022.07.21 |
Java에서 메서드 실행 시간을 어떻게 측정합니까? (0) | 2022.07.21 |
구성 요소에서 VueJS DOM이 업데이트되지 않음 (0) | 2022.07.21 |