ant-design-vue动态生成导航栏

网上找了好多文章来学习也没找到合适的，现在可以实现一个简单的文字类型的侧边栏效果，下面是具体代码

// 数据格式
const menus = [
      {
        icon: HomeOutlined,
        title: "首页",
        path: "/home",
        children: [
          {icon: '', title: "分析页", path: "/home/analysis" },
          {icon: '', title: "工作台", path: "/home/workbench" },
        ],
      },
      {
        icon: '',
        title: '文章管理',
        path: '/article',
        children: [
          {icon: '', title: '文章列表', path: '/article/list'},
          {icon: '', title: '编辑文章', path: '/article/edit'},
        ]
      }
];

// 页面内容
<a-menu theme="dark" mode="inline" :selectedKeys="selectedKeys">
    <a-sub-menu v-for="menu in menus" :key="menu.path">
      <template #title>
        <span>{{ menu.title }}</span>
      </template>
      <a-menu-item
        v-for="childrenMenu in menu.children"
        :key="childrenMenu.path"
      >
        {{ childrenMenu.title }}
      </a-menu-item>
    </a-sub-menu>
</a-menu>