Element plus NavMenu 导航菜单使用

最新推荐文章于 2025-03-17 09:56:40 发布

程序开发猿

最新推荐文章于 2025-03-17 09:56:40 发布

阅读量4.6k

点赞数 1

分类专栏： elementPlus 文章标签： elementui

本文链接：https://blog.youkuaiyun.com/qq_32209081/article/details/117779893

版权

本文详细介绍了如何使用 Element Plus 的 NavMenu 组件，重点解析了`:default-active`属性及其重要性，以及如何与`:route`配合确保导航激活状态。通过实例展示了如何设置`active`值与`route`相匹配，例如在URL为'http://localhost:8081/inquiryDisposal'时，将`active`设为'inquiryDisposal'，同时`route`设置为"inquiryDisposal"以实现正确高亮。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<el-menu 
   :default-active="active"
    class="sidebar-menu"
    background-color="#f9f9f9"
    text-color="#565656"
    unique-opened
    router
    active-text-color="#0079fe"
    :collapse="isCollapse"
    @select="handleSelect">
    <template v-for="item in menuList">
            <template v-if="item.children&&item.level==0">
                <el-submenu :index="String(item.id)" :key="item.id"