修改elementUI組件樣式
- 可以通過
/deep/操作符(>>>的別名) - 可以不用去除scoped表箭，穿透scoped烙如。
- 如果沒有效果，可以在第三方組件外層的div加個類名棵磷，然后這樣寫
.外層類名 >>> 第三方組件 - 如果出現(xiàn)
SassError: expected selector報(bào)錯风秤，可以使用::v-deep
例如
<style lang="scss" scoped>
>>> .第三方組件 {
樣式
}
/deep/ .第三方組件 {
樣式
}
::v-deep .第三方組件 {
樣式
}
.外層類名 >>> .第三方組件 {
樣式
}
</style>
當(dāng)這些沒有效果時(shí)，很多el組件都可通過插槽方式傳入要顯示的內(nèi)容笨鸡，然后在插槽通過style修改樣式，就不必去除當(dāng)前頁面的scoped
image.png
- 例子坦冠，比如要修改
Popover 彈出框的字體顏色
<el-popover placement="bottom" width="auto" trigger="hover">
<!-- **提示內(nèi)容形耗，即是我們要修改樣式的地方** -->
<!-- **通過slot="default" 傳入提示內(nèi)容content** -->
<div class="popover-style" slot="default" style="color: #b9b9b9;">
{{item.keyword}}
</div>
<!-- 觸發(fā)的內(nèi)容 -->
<div class="nr weight-400 big-desc" slot="reference">
{{item.keyword}}
</div>
</el-popover>
