vuex 读取 token

在 Vuex 中读取 token 的方法与读取其他状态的方法相同。通常，我们会在 Vuex store 中定义一个名为 `state` 的对象，其中包含应用程序中的所有状态。在该对象中，我们可以定义一个 `token` 状态，然后使用 `getters` 方法来读取它。

以下是一个简单的示例：

// store.js

const store = new Vuex.Store({
  state: {
    token: null
  },
  mutations: {
    setToken(state, token) {
      state.token = token
    }
  },
  getters: {
    getToken: state => state.token
  }
})

在上述代码中，我们定义了一个名为 `token` 的状态和一个 `setToken` mutation，用于更新 `token` 状态。然后，我们在 `getters` 中定义了一个名为 `getToken` 的方法，用于读取 `token` 状态。

要使用 `getToken` 方法，可以使用 `mapGetters` 辅助函数将其映射到组件中。例如：

// MyComponent.vue

<template>
  <div>
    <p>{{ token }}</p>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters(['getToken']),
    token() {
      return this.getToken
    }
  }
}
</script>

在上述代码中，我们使用 `mapGetters` 辅助函数将 `getToken` 映射到组件中，并将其作为计算属性 `token` 返回。然后，在组件的模板中，我们可以使用 `{{ token }}` 输出 `token` 值。