<el-menu active-text-color="#01B9D1" background-color="#393D49" class="el-menu-vertical-demo" :default-active="$route.path" text-color="#fff" router style="height:100%;width:100%;" mode="vertical" > <el-menu-item index="/home/toSetScene"> <template #title> <el-icon><House /></el-icon> <span>场景管理</span> </template> </el-menu-item> </el-menu> 中el-menu增加:collapse="isCollapse"样式变形
时间: 2024-02-10 16:35:17 浏览: 166
JINE-JE01B系列触摸屏监控系统技术说明书
如果您想让el-menu在一定条件下收缩,您可以将isCollapse设置为true,然后在el-menu中增加:collapse="isCollapse"属性,就可以实现收缩的效果。代码如下:
<el-menu
active-text-color="#01B9D1"
background-color="#393D49"
class="el-menu-vertical-demo"
:default-active="$route.path"
text-color="#fff"
router
style="height:100%;width:100%;"
mode="vertical"
:collapse="isCollapse"
>
<el-menu-item index="/home/toSetScene">
<template #title>
<el-icon><House /></el-icon>
<span>场景管理</span>
</template>
</el-menu-item>
</el-menu>
请注意,这只是一个简单的示例,如果您想实现更复杂的收缩效果,您需要编写更多的代码。
阅读全文