VUE3 Elementplus 编辑任何文档导致样式有冲突
在使用Element Plus 的情况下 打开文档编辑 会导致原本的页面UI有问题主要是在main.js 使用了 element相关的样式 。 如何解决这个问题？
本帖最后由 Lucenter 于 2024-8-8 15:34 编辑
这是正常的页面
您好，为了兼容老版本的浏览器，系统表单使用的是 ElementUI 。你使用 ElementPlus ，两边样式有冲突。
您可以修改Element Plus样式，在所有类名称前加上您最外层容器的类名，
比如
App.vue的容器为 <div class="appNode systemconfig"
ElementPlus有样式：
.fade-in-linear-enter-active, .fade-in-linear-leave-active {
transition: var(--el-transition-fade-linear)
}
修改为：
.systemconfig .fade-in-linear-enter-active, .systemconfig .fade-in-linear-leave-active {
transition: var(--el-transition-fade-linear)
}
参照 x_component_systemconfig
最好的方法是修改element plus命名空间，element plus官方有例子，而不是添加外层类名，如果楼上是o2oa官方人员，这回答真是不行 htt1231 发表于 2024-8-9 13:57
最好的方法是修改element plus命名空间，element plus官方有例子，而不是添加外层类名，如果楼上是o2oa官方 ...
确实用element plus命名空间是更好的解决方案。感谢你的建议。当然，最后一句不加就更好了，小小管理员总有力有不逮的时候。
解决方案查看附件
htt1231 发表于 2024-8-9 13:57
最好的方法是修改element plus命名空间，element plus官方有例子，而不是添加外层类名，如果楼上是o2oa官方 ...
感谢！我去试试 cxy 发表于 2024-8-13 17:09
确实用element plus命名空间是更好的解决方案。感谢你的建议。当然，最后一句不加就更好了，小小管理员总 ...
已经解决 感谢！
页:
[1]
2