Vue.js Vuex Axios标头返回未捕获的TypeError:对象（…）不是Vuex的函数

我目前正在使用Nuxt，并使用axios在我的应用程序中创建了一个中心ApiClient

服务/apiClient.js

import Vuex from 'vuex';
import * as sessions from './modules/sessions';

const store = () => {
  return new Vuex.Store({
    getters: {
      isAuthenticated() {
        return sessions.state.token != null;
      }
    },
    modules: {
      sessions
    }
  });
};

export default store;

import axios from 'axios';

export const state = {
  token: localStorage.getItem('token') || null,
};

export const mutations = {
  SET_TOKEN(state, token) {
    state.token = token;
  }
};

export const actions = {
  login({ commit }) {
    return new Promise((resolve, reject) => {
      axios.get(`/retrieveKey`)
        .then(response => {
          localStorage.setItem('token', response.data.value);
          commit('SET_TOKEN', response.data.value);
          resolve(response.data);
        })
        .catch(error => {
          reject(error);
        });
    });
  },
  logout({ commit }, context) {
    localStorage.removeItem('token');
    window.location.reload();
  }
};

export const getters = {
  getToken(state) {
    return state.token;
  }
};

从“axios”导入axios；
从“../store/index”导入存储；
常量标记=（）=>{
return store（）.getters.getToken；
};
const axioclient=axios.create({
baseURL:“这是一个url”，
标题：{
接受：'application/json'，
“内容类型”：“应用程序/json”，
'X-Api-Key'：token（）//此返回错误：对象（…）不是Vuex中的函数
}
});
axioclient.interceptors.request.use（函数（配置）{
console.log（token（））；//这将打印令牌类型字符串
返回配置；
}，函数（错误）{
返回承诺。拒绝（错误）；
});

当我在axios头文件中使用

token（）

时，我得到了一个错误：

uncaughttypeerror:Object（…）

但是当我从axios拦截器调用它时，我得到了正确的令牌类型字符串

store/index.js

import Vuex from 'vuex';
import * as sessions from './modules/sessions';

const store = () => {
  return new Vuex.Store({
    getters: {
      isAuthenticated() {
        return sessions.state.token != null;
      }
    },
    modules: {
      sessions
    }
  });
};

export default store;

import axios from 'axios';

export const state = {
  token: localStorage.getItem('token') || null,
};

export const mutations = {
  SET_TOKEN(state, token) {
    state.token = token;
  }
};

export const actions = {
  login({ commit }) {
    return new Promise((resolve, reject) => {
      axios.get(`/retrieveKey`)
        .then(response => {
          localStorage.setItem('token', response.data.value);
          commit('SET_TOKEN', response.data.value);
          resolve(response.data);
        })
        .catch(error => {
          reject(error);
        });
    });
  },
  logout({ commit }, context) {
    localStorage.removeItem('token');
    window.location.reload();
  }
};

export const getters = {
  getToken(state) {
    return state.token;
  }
};

store/modules/sessions.js

import Vuex from 'vuex';
import * as sessions from './modules/sessions';

const store = () => {
  return new Vuex.Store({
    getters: {
      isAuthenticated() {
        return sessions.state.token != null;
      }
    },
    modules: {
      sessions
    }
  });
};

export default store;

import axios from 'axios';

export const state = {
  token: localStorage.getItem('token') || null,
};

export const mutations = {
  SET_TOKEN(state, token) {
    state.token = token;
  }
};

export const actions = {
  login({ commit }) {
    return new Promise((resolve, reject) => {
      axios.get(`/retrieveKey`)
        .then(response => {
          localStorage.setItem('token', response.data.value);
          commit('SET_TOKEN', response.data.value);
          resolve(response.data);
        })
        .catch(error => {
          reject(error);
        });
    });
  },
  logout({ commit }, context) {
    localStorage.removeItem('token');
    window.location.reload();
  }
};

export const getters = {
  getToken(state) {
    return state.token;
  }
};

最新答案 可能您可以将console.log放入令牌函数中调试store（）、store（）.getters和store（）.getters.getToken的值，如下所示，并比较axiosClient调用和interceptors调用之间的差值

const token = () => {
  const store = store();
  const getters = store.getters;
  const getToken = getter.getToken;
  console.log(store, getters, getToken)
  return getToken;
};

“此返回错误：对象（…）不是Vuex中的函数”的错误消息是因为AxioClient中的令牌等于null

是因为 localStorage.getItem（'token'）的初始状态为null/未定义，因此在登录完成之前，其值变为null

export const state = {
  token: localStorage.getItem('token') || null,
};

---

请参阅，getter将显示在

store.getters

对象上，您可以将值作为属性访问

---

可能您可以通过

store.getters.getToken

而不是

store（）.getters.getToken

？

获取令牌值。您可以共享

store/index

的相关内容吗？它是否导出函数？Getter是如何定义的？@Phil我更新了问题，添加了

会话模块vuex

和

存储/索引

为什么将存储导出为函数？从axios拦截器中可以看出，仍然不起作用，我正在使用令牌函数，我正在获取实际的令牌。但是当我在axiosClient的头文件中使用它时，我得到了一个错误