Element中开发遇到的问题

Posted 2023-03-23

参考技术A 前几天在el-dialog中加上了:append-to-body="true"属性
首先:本次开发是使用sass样式

然后就遇到了el-dialog样式修改失败的问题,
复盘原因:1.首先发现样式在html中添加成功,但没有出现在style样式计算里

思考一:
猜测:el-dialog将样式过滤了,
问题1.往常开发没有遇到过滤问题,所以样式过滤,或者样式覆盖不成立

思考二:
猜测:自己开发写的样式不正确,应该去修改自己的样式han
结果:修改了很久发现只有行内样式生效,
问题:行内样式优先级高,将el-dialog样式覆盖,得出思考一的结论

最后,终于发现了:append-to-body="true"这个属性,去element官网上搜索

得出:
在嵌套Dialog场景中，将内层 Dialog 的该属性设置为 true，它就会插入至 body 元素上，从而保证内外层 Dialog 和遮罩层级关系的正确

而我的样式是卸载sass嵌套里,所以样式没有直接回到body编写的样式上,也就导致了样式没有生效