关于vue第三方组件样式无法覆盖问题的最佳解决方案

本人项目使用有赞vant vue组件,在一些特殊业务 第三方组件无法满足需求时就需要自己新加样式覆盖第三方组件的样式来实现

但在实际操作中 有些组件能直接在scope作用域的样式里直接覆盖 大部分都不能覆盖 网上的解决方案是重新写一个<style></style>

把覆盖样式写在这里 虽然能实现覆盖  但是这会影响其他组件的样式 解决方案如下

1、新建一个resetui.less样式文件

关于vue第三方组件样式无法覆盖问题的最佳解决方案

2、全局加载resetui.less样式文件(不用每个组件都加载一遍)

关于vue第三方组件样式无法覆盖问题的最佳解决方案

3、在组件内使用时

关于vue第三方组件样式无法覆盖问题的最佳解决方案

每个组件自己定义一个class 包含该组件的所有内容

resetui.less内容如下

关于vue第三方组件样式无法覆盖问题的最佳解决方案

这中覆盖方式不会影响其他组件 方便快捷 一目了然