반응형
변수를 전달하여 Vuex 상태 데이터 가져오기
저는 Vue와 Vuex를 처음 사용하는 사람입니다.현재 다음과 같이 컴포넌트에 소품을 결합하려고 합니다.
내 HTML은 다음과 같습니다.
<div id="vuemodal">
<modal :active="get('active')" :login="get('login')" :register="get('register')">
</modal>
</div>
내 Vue 인스턴스는 다음과 같습니다.
var modal = new Vue({
el: '#vuemodal',
store,
data: {
active: '',
login: false,
register: false,
},
methods: {
get: function(item){
var state = this.$store.state;
return state.item;
}
}
})
Vuex 스토어는 다음과 같습니다.
const store = new Vuex.Store({
state: {
active: 'login',
login: true,
register: false
}
})
"get" 메서드에서는 "item" 변수를 "state" 변수에 바인딩합니다.그 결과, 예를 들어 다음과 같은 결과가 됩니다.$store.state.active('snowledge'가 반환됩니다.console.log state.item을 실행하면 "undefined"라고 표시됩니다.이 문제를 해결하는 올바른 방법은 무엇입니까?아니면 전혀 다른 방법을 시도해야 합니까?
여기 당신의 코드의 jsfiddle이 있습니다.스토어 변수를 올바르게 인쇄하고 있습니다.적절한 버전의 Vue 및 Vuex를 사용해야 합니다.
const store = new Vuex.Store({
state: {
active: 'login',
login: true,
register: false
}
})
var modal = new Vue({
el: '#vuemodal',
store,
data: {
active: '',
login: false,
register: false,
},
methods: {
get: function(item){
var state = this.$store.state;
console.log("state is ", state[item])
return state.item;
}
}
})
언급URL : https://stackoverflow.com/questions/40398385/get-vuex-state-data-by-passing-a-variable
반응형
'programing' 카테고리의 다른 글
켄도 그리드(Vuex Store 포함), VueJs (0) | 2022.07.05 |
---|---|
nuxt.diamic - css 배경 이미지를 동적으로 설정하는 방법 (0) | 2022.07.05 |
내보내기 Const에서 Vue 인스턴스 액세스 (0) | 2022.07.05 |
어레이의 모든 멤버를 동일한 값으로 초기화하려면 어떻게 해야 합니까? (0) | 2022.07.05 |
Vue-CLI로 만든 앱으로 404 페이지 제공 (0) | 2022.07.03 |