ant design vue menu

Ant Design Vue是一个基于Vue.js的UI组件库，提供了丰富的组件和样式，方便开发者构建漂亮的用户界面。其中，Ant Design Vue的Menu组件用于创建菜单导航。

在Ant Design Vue的Menu组件中，常用的属性包括：
1. mode：菜单类型，可以是垂直、水平或内嵌模式。
2. inlineCollapsed：当菜单类型为inline时，控制菜单是否收起。
3. theme：主题颜色，可以是light（亮色）或dark（暗色）。
4. openKeys：当前展开的SubMenu菜单项的key数组。
5. defaultOpenKeys：初始展开的SubMenu菜单项的key数组。
6. selectedKeys：当前选中的菜单项的key数组。
7. defaultSelectedKeys：初始选中的菜单项的key数组。

在使用Ant Design Vue的Menu组件时，可以根据需要设置这些属性来实现不同的菜单样式和功能。

以下是一个Ant Design Vue Menu组件的示例代码：

<template>
  <a-menu :mode="mode" :inline-collapsed="inlineCollapsed" :theme="theme" :open-keys="openKeys" :default-open-keys="defaultOpenKeys" :selected-keys="selectedKeys" :default-selected-keys="defaultSelectedKeys">
    <a-menu-item key="1">菜单项1</a-menu-item>
    <a-sub-menu key="sub1" title="子菜单1">
      <a-menu-item key="2">子菜单项1</a-menu-item>
      <a-menu-item key="3">子菜单项2</a-menu-item>
    </a-sub-menu>
    <a-sub-menu key="sub2" title="子菜单2">
      <a-menu-item key="4">子菜单项3</a-menu-item>
      <a-menu-item key="5">子菜单项4</a-menu-item>
    </a-sub-menu>
  </a-menu>
</template>

<script>
import { Menu } from 'ant-design-vue';

export default {
  components: {
    'a-menu': Menu,
    'a-menu-item': Menu.Item,
    'a-sub-menu': Menu.SubMenu,
  },
  data() {
    return {
      mode: 'vertical',
      inlineCollapsed: false,
      theme: 'light',
      openKeys: [],
      defaultOpenKeys: [],
      selectedKeys: [],
      defaultSelectedKeys: [],
    };
  },
};
</script>

这个示例展示了一个垂直模式的菜单，其中包含了菜单项和子菜单项。你可以根据需要修改属性的值来实现不同的菜单样式和功能。