programing

변수를 전달하여 Vuex 상태 데이터 가져오기

goodcopy 2022. 7. 5. 22:57
반응형

변수를 전달하여 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

반응형