vue的样式污染问题及解决方案

接手一个项目，某个页面的样式总是会是会在演示的时候乱掉，但是我自己开发的时候该页面样式始终保持正常。研究了半天才发现原因。另一个开发写页面时自定义了一些style。如果不打开他的页面就没问题，但是如果在打开他的页面之后打开我的页面，vue的某个特性就会导致他的样式污染我的页面样式。解决方法：在他的style上加入scope属性：值得注意的是，vue的scope属性会

渴望死亡的小丑

6097人浏览 · 2018-04-08 17:27:50

渴望死亡的小丑 · 2018-04-08 17:27:50 发布

接手一个项目，某个页面的样式总是会是会在演示的时候乱掉，但是我自己开发的时候该页面样式始终保持正常。

研究了半天才发现原因。另一个开发写页面时自定义了一些style。如果不打开他的页面就没问题，但是如果在打开他的页面之后打开我的页面，vue的某个特性就会导致他的样式污染我的页面样式。

解决方法：

在他的style上加入scope属性：

值得注意的是，vue的scope属性会导致该style不能覆盖Import进来的css样式文件

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^