Question

我正在使用vue.js和coreui创建一个网站。问题是我在此网站上有2种用户（即Admin和Users）。我希望在登录user->（users）时在导航栏中仅添加导航栏上的某些项目。我该如何实现？我一直在阅读文档，但没有发现麻烦。

我不知道该如何覆盖此侧边栏模板，我曾尝试直接更改@coreui文件，但未反映出来。

任何帮助将不胜感激。谢谢

_nav.js

export default {
    items: [
        {
            name: 'Dashboard',
            url: '/dashboard',
            icon: 'icon-speedometer',
            badge: {
                variant: 'primary',
                text: 'NEW'
            }
        },
        {
            title: true,
            name: 'Administrator',
            class: '',
            wrapper: {
                element: '',
                attributes: {}
            }
        },
        {
            name: 'PRC',
            url: '/priority',
            icon: 'icon-layers',
            children: [
                {
                    name: 'PRC Types',
                    url: '/priority',
                    icon: 'icon-puzzle'
                },
                {
                    name: 'PRC Range',
                    url: '/priority/range',
                    icon: 'icon-directions'
                }
            ]
        },

        {
            name: 'Users',
            url: '/users',
            icon: 'icon-user'
        },
        {
            name: 'SubTenant',
            url: '/tenant',
            icon: 'icon-user'
        },
        {
            name: 'Groups',
            url: '/groups',
            icon: 'icon-list'
        },
        {
            name: 'TaskList',
            url: '/tasklist',
            icon: 'icon-list'
        },
        {
            name: 'ProcessList',
            url: '/process',
            icon: 'icon-list'
        },
    ]
}

main.js

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import 'core-js/es6/promise'
import 'core-js/es6/string'
import 'core-js/es7/array'
// import cssVars from 'css-vars-ponyfill'
import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import App from './App'
import router from './router'
import axios from 'axios'
import VueAxios from 'vue-axios'
import VueAuth from '@websanova/vue-auth'
import VeeValidate from 'vee-validate';
import Element from 'element-ui'

Vue.use(Element);
Vue.use(VeeValidate);
Vue.use(VueAxios, axios);

Vue.axios.defaults.baseURL = 'http://127.0.0.1:8080/api/v1/client';
Vue.router  = router;
Vue.use(VueAuth, {
    auth: require('@websanova/vue-auth/drivers/auth/bearer.js'),
    http: require('@websanova/vue-auth/drivers/http/axios.1.x.js'),
    router: require('@websanova/vue-auth/drivers/router/vue-router.2.x.js'),
    tokenDefaultName:"token",
    tokenStore: ['localStorage', 'cookie'],
    authRedirect: {path: '/auth'},
    notFoundRedirect: {path: '/dashboard'},
    fetchData:{url : "auth" , method : "GET"},
    refreshData:{enabled:false}
  });

Vue.use(BootstrapVue);

new Vue({
  el: '#app',
  router,
  template: '<App/>',
  mounted(){
  },
  methods: {
  },
  components: {
    App
  }
});

而且我不是在寻找如何做这部分。

在核心ui vue.js中的导航栏上有条件地渲染项目的问题

0 个答案: