vue爬坑之路（六）— scoped

在vue中，我们有的时候难免会引入第三方UI组件库，但是在UI组件使用过程中，我们有的时候会对里面引入的一些样式进行修改，但是在开发大型项目过程中，为了避免class的样式污染，我们通常会使用scoped，会确保你的样式只会运用在它们想要作用的组件上,这也造成了我们无法对对三方组件库的一些样式进行修改。但是也并非没有办法去解决。比如

在scss和less中 /deep/ +第三方组件类名

这样，该组件样式只会在当前组件中进行了样式的修改，不会污染全局样式

​
 <style scoped lang="scss">
    /deep/.el-table td, .el-table th.is-leaf{
        background:#e2a7e2;
    }
  </style>

​

效果如图，在当前组件的页面中，该页面样式已进行修改

 

图片1

 

在其他页面中，同样的表格，样式却没有被修改