element-plus导航栏侧边折叠

最新推荐文章于 2024-09-26 15:16:12 发布

Realistic-er

最新推荐文章于 2024-09-26 15:16:12 发布

阅读量1.6k

点赞数

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/m0_52518047/article/details/128334222

版权

element-plus导航栏侧边折叠是用过el-aside和el-menu配合来共同完成的，这是固定的写法

需要注意的点：
（1）menu外层标签应该是el-aside，不可以是div，不然一级菜单和二级菜单宽度会不一致
（2）el-aside的宽度不是固定的，需要通过三元表达式来灵活改变其宽度

<el-aside class="sidemenu" :width="isCollapse ? '60px' : '201px'">
    <el-menu
        background-color="#001529"
        class="el-menu-vertical-demo"
        :default-active="currentroute"
        :unique-opened="true"
        :collapse="isCollapse"
        text-color="#858e8b"
        @open="handleOpen"
        @close="handleClose"
        router
      >
    </el-menu>
  </el-aside>