Vuex, authorization. Why do getters return undefined?

  • 0
    I am trying to do authorization in Vue.js.
    There is a registration method. It works fine.
    registration ({commit}, data) {
        return new Promise((resolve, reject) => {
          axios
            .post(localStorage.getItem('url') + 'user/add', data)
            .then(response => {
              const token = response.data.result.token
              console.log(token)
              localStorage.setItem('token', token)
              axios.defaults.headers.common['Authorization'] = token
              commit('AUTH_SUCCESS', token)
              resolve(response)
            })
            .catch(err => {
              commit('auth_error', err)
              localStorage.removeItem('token')
              reject(err)
            })
        })
      },

    The token is saved in localStorage, the AUTH_SUCCESS mutation is also performed, everything seems to be ok.
    AUTH_SUCCESS (state, token) {
        state.status = 'success'
        state.token = token
      },


    But when I later try to check with getters, it gives undefined.
    Getters:
    const getters = {
      isLoggedIn: state => !!state.token,
      authStatus: state => state.status
    }

    In the router, beforeEach console.log (store.getters.isLoggedIn) is already undefined.
    console.log (store.getters.authStatus) - also
    store is imported into the router. Please tell me where to look, what's wrong?

    I am not a front, so sorry if the question is stupid or crooked.
    JavaScript Graham McDaniel, Mar 9, 2019

  • 0 Answers
Your Answer
To place the code, please use CodePen or similar tool. Thanks you!