vue-admin-template中，怎么设置当前访问者的角色？

### 回答1：
在 vue-admin-template 中，可以在登录成功后将当前访问者的角色信息存储到 vuex 中，然后在后续的操作中使用这些信息。

首先，在登录成功后，应该将当前访问者的角色信息从服务器端获取到，例如通过请求接口 /api/user/info 获取到当前访问者的角色信息。然后，可以使用 vuex 的 commit 方法来更新状态，将当前访问者的角色信息存储到 vuex 中。

例如，在登录成功后，可以在登录成功的回调函数中执行以下操作：

// 获取当前访问者的角色信息
axios.get('/api/user/info').then(response => {
  // 将当前访问者的角色信息存储到 vuex 中
  store.commit('user/SET_ROLE', response.data.role)
})

然后，在需要使用当前访问者角色信息的地方，可以使用 vuex 的 getters 方法来获取当前访问者的角色信息。

例如，在组件中可以使用以下方式获取当前访问者的角色信息：

import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters({
      role: 'user/role'
    })
  }
}

在模板中可以使用以下方式获取当前访问者的角色信息：

<template>
  <div>
     

### 回答2：
在vue-admin-template中设置当前访问者的角色主要有两个步骤：首先是在路由中设置角色权限，然后在登录成功之后将用户角色信息保存在本地存储中。

首先，在路由中设置角色权限。在项目的路由配置文件（一般为src/router/index.js）中，我们可以看到有一个routes数组，该数组中存放着我们的路由信息。每一个路由信息都包含一个meta字段，该字段可以自定义一些附加信息。我们可以在meta字段中添加一个role属性来表示该路由所需的角色权限，例如：
{
  path: '/admin',
  name: 'Admin',
  component: () => import('@/views/admin'),
  meta: { role: ['admin'] }
}
在上面的例子中，我们设置了一个名为'Admin'的路由，该路由的角色权限为'admin'。如果当前登录的用户角色与这个角色相匹配，才能访问该路由。

其次，在用户登录成功之后要将用户角色信息保存在本地存储中。我们可以使用浏览器提供的localStorage或sessionStorage对象来进行本地存储。在用户登录成功后，可以将用户信息保存在本地存储中，例如：
localStorage.setItem('userRole', 'admin');
上面的例子中，我们将当前登录用户的角色设置为'admin'并保存在本地存储中。

当页面跳转到需要权限验证的路由时，我们可以通过读取本地存储中的用户角色信息来判断是否具有访问权限。例如，我们可以在导航守卫中进行判断：
router.beforeEach((to, from, next) => {
  const userRole = localStorage.getItem('userRole');
  const requiredRole = to.meta.role;

  if (requiredRole && !requiredRole.includes(userRole)) {
    next('/403');  // 没有权限，跳转到403页面
  } else {
    next();  // 有权限，正常跳转
  }
})
上述代码中，我们从本地存储中获取用户角色信息（userRole），然后与当前路由所需的角色权限（requiredRole）进行比较，如果不具备权限，则跳转到403页面，否则正常跳转。

综上所述，在vue-admin-template中设置当前访问者的角色需要在路由中设置角色权限，并在登录成功后将用户角色信息保存在本地存储中，在导航守卫中进行权限判断。这样可以实现对不同角色用户的访问控制。  

### 回答3：
在vue-admin-template中设置当前访问者的角色需要进行以下步骤：

1. 打开项目的路由文件src/router/index.js。

2. 在路由配置文件中，每个路由都有一个meta字段，用于存储一些自定义的信息。我们可以在路由中添加一个meta字段来存储访问者的角色信息。

{
path: '/example',
component: Layout,
meta: { role: ['admin', 'editor'] },
children: [
{
path: 'index',
name: 'Example',
component: () => import('@/views/example/index'),
meta: { title: 'Example', icon: 'example' }
}
]
}

3. 在页面组件中，可以通过this.$route.meta.role来获取访问者的角色信息。

export default {
created() {
console.log(this.$route.meta.role) // 输出当前访问者的角色信息
}
}

4. 根据当前访问者的角色信息，可以在页面上做出不同的展示和操作。

以上就是在vue-admin-template中设置当前访问者的角色的方法。通过在路由中添加meta字段来存储角色信息，并在页面组件中获取并利用该信息进行展示和操作。