반응형
Vuex 스토어 모듈 상태에서 'this'에 액세스하는 방법
예를 들어 다음과 같은 "store" 디렉토리가 있다고 가정합니다.
...
store
├── auth
│ └── user.js
└── index.js
...
index.displaces를 표시합니다.
import Vue from 'vue';
import Vuex from 'vuex';
import {user} from './auth/user';
Vue.use(Vuex);
/* eslint-disable no-new */
const store = new Vuex.Store({
modules: {
user
},
});
export default store;
현재,user
저장 일부 상수와 기타 상태 변수가 있습니다.state
소품. 어떻게 하면state
소품들 자체에서요?예를들면user
스토어는 다음과 같습니다.
user.displaces
export const user = {
namespaced: true,
state: {
// hardcoded string assigned to user.state.constants.SOME_CONST
constants: {
SOME_CONST: 'testString'
},
// Another property where I would like to reference the constant above
someOtherStateProp: {
// Trying to access the constant in any of these ways throws
// 'Uncaught ReferenceError: .... undefined'
// Where '...' above is interchangeable with any root I try to access the constant from (this, state etc)
test1: this.state.constants.SOME_CONST,
test2: user.state.constants.SOME_CONST
test3: state.constants.SOME_CONST
test4: constants.SOME_CONST
test5: SOME_CONST
// .... etc. All the above throw ReferenceError's
}
}
};
참조 방법user.state.constants.SOME_CONST
부터user.state.someOtherStateProp.test1
?
뭔가 아주 근본적인 걸 놓치고 있는 것 같아
가장 간단한 방법은 선언하는 것입니다.CONSTANTS
모듈을 내보내기 전 오브젝트 및 다음과 같이 인식합니다.
const CONSTANTS = {
SOME_CONST: 'testString'
}
export const user = {
namespaced: true,
state: {
// hardcoded string assigned to user.state.constants.SOME_CONST
constants: CONSTANTS,
// Another property where I would like to reference the constant above
someOtherStateProp: {
test1: CONSTANTS.SOME_CONST,
}
}
};
이 작업은 두 가지 단계로 수행할 수 있습니다.
let user = {
namespaced: true,
state: {
SOME_CONST: 'testString'
}
};
Object.assign(user, {
state: {
someOtherStateProp: {
test1: user.state.SOME_CONST
}
}
});
export default user;
자세한 것은 이쪽Object.assign
여기 - https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
언급URL : https://stackoverflow.com/questions/47652862/how-to-access-this-in-vuex-store-module-state
반응형
'source' 카테고리의 다른 글
JS/jQuery에서 키 누르기/키 다운/키 업 이벤트를 트리거하시겠습니까? (0) | 2022.11.15 |
---|---|
구성 요소에 Vuex 맵 상태가 정의되어 있음에도 정의되지 않은 오류가 발생함 (0) | 2022.11.15 |
Mockito는 인수를 고려하지 않고 메서드를 스텁할 수 있습니까? (0) | 2022.11.15 |
기본 Java 문자 인코딩 설정 (0) | 2022.11.15 |
CodeIgniter의 ActiveRecord를 사용하여 열 값이 NULL이 아닌 행을 선택하려면 어떻게 해야 합니까? (0) | 2022.11.15 |