vue 用什么存储token

在Vue项目中，通常有两种方式来存储和管理token：

使用Vuex进行状态管理：
Vuex是Vue的官方状态管理库，它提供了一个集中存储所有组件的状态的地方，并以相应的规则保证状态以一种可预测的方式发生变化。你可以在Vuex的state中存储token，并通过mutations或actions来更新token。这样，你可以在任何组件中通过this.$store.state.yourTokenState来访问token，并在用户登录后更新它。
```
// 在store.js中
const store = new Vuex.Store({
  state: {
    token: null
  },
  mutations: {
    setToken(state, token) {
      state.token = token;
    }
  },
  actions: {
    updateToken({ commit }, token) {
      commit('setToken', token);
    }
  }
});
```
然后，在组件中，你可以这样更新token：
```
// 在Login.vue中
this.$store.dispatch('updateToken', yourTokenValue);
```
使用LocalStorage或SessionStorage：
Web Storage API提供了两种在客户端存储数据的方式：localStorage和sessionStorage。localStorage中的数据没有过期时间，而sessionStorage中的数据在页面会话结束时会被清除。你可以根据需要选择其中一种来存储token。
```
// 存储token
localStorage.setItem('token', yourTokenValue);
// 或者
sessionStorage.setItem('token', yourTokenValue);

// 获取token
const token = localStorage.getItem('token');
// 或者
const token = sessionStorage.getItem('token');
```

在选择存储方式时，需要考虑到安全性和应用需求。Vuex状态管理库更适合在多个组件之间共享状态，而localStorage和sessionStorage则适合持久化存储数据，如在用户关闭浏览器后仍然需要保留token。通常，为了防止页面刷新导致状态丢失，可以将token存储在localStorage或sessionStorage中，并在Vuex中进行同步。