基于vue通过路由规则生成导航栏菜单内容

基于vue通过路由规则生成导航栏菜单内容

在我们要完成主要由导航栏来定位到其它子页面的项目时，如果手动为导航栏添加item和导航地址，那将十分繁琐。本文为解决这个问题而记录。

创建路由规则文件
/router/index.js

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

const routes = [
  {
   
    path: '/',
    name: 'HelloWorld',
    descript: '你好',
    component: () => import('@/components/HelloWorld')
  },
  {
   
    path: '/page',
    name: 'Page',
    descript: '页面1',
    component: () => import('@/components/Page'),
    children: [
      {
   
        path: 'child',
        name: 'Child',
        descript: