Vue.js 如何使用存储在Vue/Nuxt插件中?

Vue.js 如何使用存储在Vue/Nuxt插件中?,vue.js,vuex,nuxt.js,Vue.js,Vuex,Nuxt.js,我正在编写一个nuxt应用程序,通过后端进行身份验证。我有一个拦截所有http请求的http插件。我需要向所有请求添加一个身份验证令牌,该令牌在存储区中。我想知道的是,如何从插件访问商店 import axios from 'axios'; var api = axios.create({ baseURL: 'http://127.0.0.1:8000/api/' }); api.interceptors.request.use(function (config) { conf

我正在编写一个nuxt应用程序,通过后端进行身份验证。我有一个拦截所有http请求的http插件。我需要向所有请求添加一个身份验证令牌,该令牌在存储区中。我想知道的是,如何从插件访问商店

import axios from 'axios';

var api = axios.create({
   baseURL: 'http://127.0.0.1:8000/api/'
});

api.interceptors.request.use(function (config) {
    config.headers = {
        'Authorization': 'Bearer' + **how do access store?**
    }

    return config;
 }, function (error) {
       return Promise.reject(error);
 });

export default api;

谢谢

您可以尝试从插件中的上下文使用app store。 您的插件需要进行一些更改:

import axios from 'axios';

var api = axios.create({
   baseURL: 'http://127.0.0.1:8000/api/'
});

export default (context, inject) => {
  api.interceptors.request.use(function (config) {
    config.headers = {
        'Authorization': 'Bearer' + context.app.$store.state.your_path_to_token
    }

    return config;
  }, function (error) {
       return Promise.reject(error);
  });

  return api;
}
还有一种方法是创建store/index.js文件并将其导入插件。

查看本指南或示例