반응형
Vuex 스토어에 액세스할 수 없음
나는 vuex 상점을 만들었다.
export const general = {
namespaced: true,
state: {
menuEnabled: true,
headerEnabled: true
},
getters: {
menuState: state => state.menuEnabled,
headerState: state => state.headerEnabled
},
actions: {
setMenuVisibility({commit}, visibility) {
commit('setMenuVisibility', visibility);
},
setHeaderVisibility({commit}, visibility) {
commit('setHeaderVisibility', visibility);
}
},
mutations: {
setMenuVisibility(state, visibility){
state.menuEnabled = visibility;
},
setHeaderVisibility(state, visibility){
state.headerEnabled = visibility;
}
}
}
인덱스 js
import { createStore } from "vuex";
import { auth } from "./auth.module";
import {general} from "./general.module";
const store = createStore({
modules: {
general,
auth
},
});
export default store;
main.js.
import router from "./router";
import store from "./store";
createApp(App)
.use(store)
.use(router)
.mount('#app')
그 후, 나는 2개를 만들었다.computed
에 있어서의 기능.App.vue
:
computed: {
menuVisibilityState : function (){
return this.$store.state.menuEnabled;
},
headersVisibilityState : function () {
return this.$store.state.headerEnabled;
}
}
나는 수입하려고 했다.general
에 직접App.vue
가치관을 얻는다.
내 생각에 그것은 그들을 얻는 나쁜 방법인 것 같아.
누가 좀 도와줄래?
Vuex에서 모듈을 생성할 때 모듈에 제공한 이름에 따라 로컬 상태가 중첩된다(루트 상태에 액세스할 때 이 문제가 발생함).
예를 들어 일반 모듈의 로컬 상태에 액세스하려면 다음을 기록하십시오.
computed: {
menuVisibilityState : function (){
return this.$store.state.general.menuEnabled;
},
headersVisibilityState : function () {
return this.$store.state.general.headerEnabled;
}
}
다음 사항에 유의하십시오.
동작 및 돌연변이는 여전히 글로벌 네임스페이스에 등록되어 있으며, 이를 통해 여러 모듈이 동일한 동작/동작 유형에 반응할 수 있다.게이터도 기본적으로 글로벌 네임스페이스에 등록된다.https://vuex.vuejs.org/guide/modules.html#namespacing
참조URL: https://stackoverflow.com/questions/71445123/vuex-store-is-inaccessible
반응형
'programing' 카테고리의 다른 글
Java 8에서 두 날짜 사이의 일 계산 (0) | 2022.05.05 |
---|---|
프스레드 vs.오픈MP (0) | 2022.05.05 |
왜 memcpy보다 memmove가 더 빠른가? (0) | 2022.05.05 |
Vuex 작업을 여러 파일로 분할 (0) | 2022.05.05 |
사용모멘트VueJS 3의 JS 전역 (0) | 2022.05.05 |