无法在 ~/plugins/axios.js 中获取 Vuex 存储的状态 [英] Can't get state stored by Vuex in ~/plugins/axios.js

问题描述

我在获取 Vuex 存储在 ~/plugins/axios.js 中的令牌时遇到问题.希望你们帮我看看.

I have problem to get token stored by Vuex in ~/plugins/axios.js. Hope your guys take a look for me please.

我的 Vuex:~/store/index.js

My Vuex: ~/store/index.js

export const state = () => ({
  authUser: null,
  token: null
})

export const mutations = {
  SET_USER: function (state, user) {
    state.authUser = user
  },
  SET_TOKEN: function (state, token) {
    state.token = token
    instance.defaults.headers = { Authorization: 'Bearer ' + token }
  }
}

export const actions = {
  async nuxtServerInit ({ commit }, { req }) {
    ...
  },
  async login ({ commit }, { username, password }) {
    ...
  }
}

const store = () => new Vuex.Store({
  state,
  mutations,
  actions,
  modules: {
    feed,
    users,
    notification,
    messenger
  }
})

export default store

const VuexStore = () => {
  return store
}
export { VuexStore }

~/plugins/axios，其中 VuexStore.state 不是数据！

import axios from 'axios'
import {VuexStore} from '~/store'

var api = axios.create({
  baseURL: 'http://localhost:8000/api/v1/'
})
console.log(VuexStore.state.token) // Null data

export default api

控制台日志是:

ƒ VuexStore() {
  return store;
}

推荐答案

未测试，但您可以使用以下内容:

Not tested but you could use something like:

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const state = () => ({
  authUser: null,
  token: null
})

const mutations = {
  SET_USER: function (state, user) {
    state.authUser = user
  },
  SET_TOKEN: function (state, token) {
    state.token = token
    instance.defaults.headers = { Authorization: 'Bearer ' + token }
  }
}

const getters = {
 ...
}

const actions = {
  async nuxtServerInit ({ commit }, { req }) {
    ...
  },
  async login ({ commit }, { username, password }) {
    ...
  }
}

export default new Vuex.Store({
  state,
  actions,
  mutations,
  getters,
  modules: {
    ...
  }
});

~/plugins/axios.js

import axios from 'axios'
import VuexStore from '~/store'

var api = axios.create({
  baseURL: 'http://localhost:8000/api/v1/'
})
console.log(VuexStore.state.token) 

export default api

这篇关于无法在 ~/plugins/axios.js 中获取 Vuex 存储的状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！