vue限制菜单列表展示

默认动态路由配置了多个页面就会展示多个页面，但实际需要限制只展示前面几个页面所以需要限制
在router.js中找到

  // 方法一、获取菜单列表, 添加并全局变量保存，只针对某些权限生效，因此还需要优化
  http
    .get('/sys/menu/nav')
    .then(({ data: res }) => {
      if (res.code !== 0) {
        Vue.prototype.$message.error(res.msg)
        return next({ name: 'login' })
      }
      window.SITE_CONFIG['menuList'] = res.data
      fnAddDynamicMenuRoutes(window.SITE_CONFIG['menuList'])
      next({ ...to, replace: true })

	//此处添加一行代码，代表将默认长度8改成了4，所以就会只展示前面4个页面
      window.SITE_CONFIG['menuList'][1].children.length = 4

      console.log(window.SITE_CONFIG['menuList'][1])
    })
    .catch(() => {
      next({ name: 'login' })
    })
})


方法二（推荐）
 //遍历数组，根据数组里面的name来定位，列举有8个页面只展示4个页面的长度，再赋值展示
 //代码需要写在main-sidebar.vue中的created()方法里
 //不同权限都生效
 
   created() {
    //限制展示
    for (var i = 0; i < window.SITE_CONFIG['menuList'].length; i++) {
      if (window.SITE_CONFIG['menuList'][i].name == '门店管理') {
        window.SITE_CONFIG['menuList'][i].children.length = 4
      }
    }

    this.$store.state.sidebarMenuList = window.SITE_CONFIG['menuList']
  },