一、? ? ? (如果改完某個屬性不生效，就用? !important? ?)

在寫一下vue項目的時候，經(jīng)常會引起一些組件，無論是自定義組件還是引入的外部組件，style經(jīng)常用scoped屬性實現(xiàn)組件的私有化，防止影響到其他頁面上的樣式。但是有時候需要在父組件中更改子組件的樣式，比如要改變element-ui某個深層次元素（eg:.el-input_inner）或其他深層次樣式時，就要用到組件穿透，（也叫深度修改css,深度作用選擇器）

二、可用的方法有 >>> 、 /deep/ 、 ::v-deep

有些像 Sass 之類的預處理器無法正確解析 >>>。這種情況下你可以使用 /deep/ 或 ::v-deep 操作符取而代之——兩者都是 >>> 的別名，同樣可以正常工作。

如果項目style使用的是css 原生樣式,那么你可以直接使用 >>> 穿透修改

但是像scss等預處理器卻無法解析>>>，所以我們使用下面的方式.

/deep/

項目style中用到了css預處理器 scss 、sass、less時， 操作符 >>> 可能會因為無法編譯而報錯 ?？梢允褂?/deep/

但是在vue-cli3編譯時，/deep/的方式會報錯或者警告，導致變異報錯。這個時候用::v-deep

::v-deep

::v-deep在預處理器 scss 、sass、less 比較通用

切記必須是雙冒號，是::v-deep而不是::deep

總結

當我們在項目中需要用額外的樣式來打造自己的應用樣式時，只能通過深度作用選擇器

style為css時的寫法如下

.a >>> .b {

}

style使用css的預處理器(less， sass， scss)的寫法如下

第一種/deep/

/deep/ .a {

}

第二種::v-deep

::v-deep .a{

}

建議使用第二種方式，/deep/在某些時候會報錯，::v-deep更保險并且編譯速度更快（網(wǎng)上沒有找到相關資料，無從驗證）。