Vuex getter가 null을 반환함

Vuex getter가 null을 반환함

vue와 vuex를 사용하여 간단한 사용자 로그인 시스템을 만들고 있습니다.문제는 스토어에서 null이 반환되는 에러 상태가 되고 싶을 때 입니다.하지만 타임아웃을 추가하면 원하는 것이 반환됩니다.변환 섹션에 console.log 메시지를 추가하고 컴포넌트 메서드에 콘솔로그를 추가했습니다.출력은 다음과 같습니다.

돌연변이는 성분 뒤에 온다.

내 가게

const state = {
    error: null
};

const getters = {
    getError: state => state.error,
};

const actions = {
    login({ commit }, user) {
        axios.post('http://localhost:3000/api/users/login', user).then(res => {
            //User auth part
        })
            .catch(err => { //I am committing to mutation
                commit('auth_error', err.response.data);
                return err.response.data;
            });
    }
};

const mutations = {//I am mutating my error state
    auth_error(state, err) {
        console.log('MUTATION MESSAGE:', err);
        state.error = err;
    },
};

컴포넌트는 다음과 같습니다.

import { mapActions, mapGetters } from "vuex";
export default {
  computed:{
    ...mapGetters(['getError']),
  },
  methods: {
    ...mapActions(["login"]),
    loginUser() {
      const user = {
        username: this.username,
        password: this.password,
      };
      this.login(user)//I am calling my store's method
        .then((res) => {
          if (!res.data.error) {
            console.log("Success");
          } else {
            console.log(res.data.message);
          }
        })
        .catch((err) => {//Here is my problem
          console.log('COMPONENT MESSAGE', this.getError);
          setTimeout(() => {//If i add timeout, it works.
            this.error = this.getError;
          }, 500);
        });
    },
  },
};

부족한 부분이 있으면 알려주세요.

액션에서 http 약속을 반환해야 합니다.

login({ commit }, user) {
  return axios.post('http://localhost:3000/api/users/login', user).then(res => {
    //User auth part
  })
  .catch(err => { //I am committing to mutation
    commit('auth_error', err.response.data);
    return err.response.data;
  });
}

이제 제대로 쇠사슬을 묶을 수 있습니다..then컴포넌트 내 약속에서 제외됩니다.

언급URL : https://stackoverflow.com/questions/65979949/vuex-getter-returns-null