el-menu解决外层div导致collapse失效问题

作者: 习惯水文的前端苏 | 来源:发表于2022-11-11 13:44 被阅读0次

$\bullet$ 问题描述

接口请求回菜单列表后，使用v-for循环在el-menu-item外层套用div，collapse失效

$\bullet$ 问题修复

$\ast$ 利用vue的plugin能力注册全局fragment组件

$\ast$ setup阶段标记出需要处理的节点，默认生成div标签包裹

$\ast$ mounted后，开始对插槽传入的dom节点做处理，本质上就是将fragment组件包裹的子dom节点提取出来放置到原父节点下并删除fragment组件默认的根节点

$\bullet$ 使用

$\ast$ 使用

$\ast$ 页面渲染结果

网友评论

本文标题：el-menu解决外层div导致collapse失效问题

本文链接：https://www.haomeiwen.com/subject/uuiztdtx.html

备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！