Programing

vuex에 저장된 공리에서 response.data 정의되지 않음 가져오기

c10106 2022. 5. 24. 22:53
반응형

vuex에 저장된 공리에서 response.data 정의되지 않음 가져오기

정의되지 않은 response.data 가져오기console.log(this.$store.getters.getData)vue 구성 요소에서

그러나 이 문장으로 response.data를 얻을 수 있다.console.log(resp.data)

난 시도했다.console.log(data)성공적 돌연변이에, 하지만 여전히 정의되지 않은 상태로 돌아왔어

login.vue

    login: function() {
        let data = this.$store
          .dispatch("login", data)
          .then((resp) => {
            console.log(resp.data);  -> it returned data
            console.log(this.$store.getters.getData);  -> it returned undefined

            }
          })
          .catch(err => {});
      }

store.js.

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import qs from 'qs'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    status: '',
    token: localStorage.getItem('token') || '',
    data: {},
  },
  mutations: {
    success(state, token, data) {
      state.status = 'success'
      state.token = token
      Vue.set(state, 'data', data)
    }
  },
  actions: {
    login({ commit }, data) {
      return new Promise((resolve, reject) => {
        axios.post(url, qs.stringify(data))
          .then(resp => {
            commit('success', resp.data.token, resp.data)
            resolve(resp)
          })
          .catch((error) => {
            commit('error')
            reject(error)
          })
      })
    },
  getters: {
    getData: state => state.data,
  }
})

console.log(resp.data); -> it returned data console.log(this.$store.getters.getData); -> it returned undefined

마침내 나는 돌연변이가 상태와 페이로드라는 두 개의 매개 변수만 받아들이기 때문에 다른 매개 변수들은 통과되지 않을 것이기 때문에 왜 정의되지 않은 상태로 되돌아왔는지 알아냈다.

참조 - Vue 스토어의 돌연변이에 번째 매개 변수를 보낼 없음

대신 Vue.set(상태,'data',data) 쓰기 상태.data = data;

참조URL: https://stackoverflow.com/questions/58157756/get-undefined-of-response-data-from-axios-that-stored-in-vuex

반응형