Vue3中使用element-plus菜单折叠后文字不消失

今天使用element-plus中国的导航菜单时,发现菜单栏折叠起来时文字不会自动消失,因为element-plus中内置了菜单折叠文字自动消失的,使用collapse=true/false即可,但在实际使用中出现了一下问题:

Vue3中使用element-plus菜单折叠后文字不消失_第1张图片

折叠以后文字并没有消失,查资料说是el-menu子标签中不能含有div,但是排查了后也没有使用div,最后发现是因为我的一级导航没有包裹到标签中,因为是直接使用了一个简易的非折叠导航栏,折叠是后边加上去的,所以忽略了这个问题。这一部分写在了标签外面。

Vue3中使用element-plus菜单折叠后文字不消失_第2张图片

使用span包裹一下就好了

Vue3中使用element-plus菜单折叠后文字不消失_第3张图片

Vue3中使用element-plus菜单折叠后文字不消失_第4张图片

你可能感兴趣的:(vue.js,前端,elementui)