时间戳

首页 > 解决方案 > VueJS SideMenuBar 组件

vue.js - VueJS SideMenuBar 组件

问题描述

我正在使用https://www.npmjs.com/package/vue-sidebar-menu中的 SideMenuBar 为我的应用程序生成侧边菜单。栏中的元素应该是动态的，基于此人是否登录。我遇到的问题是，当我登录时，这些项目没有反应 - 我需要刷新浏览器才能刷新菜单。知道我做错了什么吗？

 <div id="app">
   <sidebar-menu :menu="dynamicMenu" @toggle-collapse="onToggleCollapse" @item-click="onItemClick" :collapsed="collapseMenu" >
   </sidebar-menu>
<router-view />

computed: {
isAuthorized: function() {
  return UserStorageService.GetUser() === null ? false : true;
},
dynamicMenu() {
  return [
    {
      header: true,
      title: "Menu",
      hiddenOnCollapse: true
    },
    {
      href: { path: "/" },
      title: "Home",
      icon: "fas fa-home"
    },
    {
      href: { path: "/Dashboard" },
      title: "Dashboard",
      icon: "fas fa-folder",
      hidden: !this.isAuthorized
    },
    {
      href: { path: "/" },
      title: "Reporting",
      icon: "fas fa-archive",
      hidden: !this.isAuthorized
    },
    {
      href: { path: "/" },
      title: "My profile",
      icon: "fas fa-share-alt",
      hidden: !this.isAuthorized
    }
  ]
}

},

当我登录时，“isAuthorized”的值应更改为 true。然后应该将该值分配给我的动态菜单（反向），并且应该切换菜单选项隐藏/不隐藏。

标签： vue.jsvuejs2

解决方案

推荐阅读