微信小程序覆蓋自定義組件樣式

小程序官方文檔明確指出，引入的第三方自定義組件，是不可以對其進行CSS樣式覆蓋的，但是我們還想要修改怎么辦呢？自定義組件時會之定義個外部類，通過這個外部類來修改樣式。

 

修改https://weapp.iviewui.com/所提供的組件樣式為例，它定義了一個外部類接口：

 
1. 通過第三方組件給出的externalClasses: ['i-class'],來指定自己的樣式類

自己的wxml

i-class="myrate"

 <i-rate i-class="myrate" bind:change="onChange5" count="5" value="3" size="15"></i-rate>
<!-- i-class 通過外部類定義自己的類（像別名一樣），來修改樣式-->

 
2. 修改自己的css文件

i-badge是第三方樣式類，接下來使用自定義的類（第三方組價的別名）修改樣式

.mytab i-badge {
  width: 189rpx;
}

成功覆蓋樣式！