element Dropdown二级下拉菜单
在使用 Element UI 的 Dropdown 组件创建二级下拉菜单时,可以嵌套使用 Dropdown 和 Dropdown-menu 组件来实现。以下是一个简单的例子:
<template>
<el-dropdown>
<span> 一级下拉菜单 </span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item> 菜单项 1 </el-dropdown-item>
<el-dropdown-item> 菜单项 2 </el-dropdown-item>
<!-- 这里嵌套一个二级下拉菜单 -->
<el-dropdown>
<el-dropdown-item divided> 一级菜单项 3 </el-dropdown-item>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item> 二级菜单项 1 </el-dropdown-item>
<el-dropdown-item> 二级菜单项 2 </el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-dropdown-menu>
</el-dropdown>
</template>
<script>
export default {
// 你的组件逻辑
};
</script>
<style>
/* 你的样式 */
</style>
在这个例子中,我们创建了一个一级下拉菜单,其中包含了一个二级下拉菜单。一级菜单项 3 被点击时,会展示出二级菜单,包含二级菜单项 1 和二级菜单项 2。
评论已关闭