自定义组件使用ui-icon的时候 图标不显示

创建自定义组件的时候 包含<ui-icon></ui-icon>的地方图标不显示代码如下
<view class="user-tab">
<view class="itme">
<ui-icon class="icon" size="22" color="#999" type="shouye1"></ui-icon>
<text class="text">{{menu.text1}}</text>
</view>
<view class="itme">
<ui-icon class="icon" size="22" color="#999" type="dingdan"></ui-icon>
<text class="text">{{menu.text2}}</text>
</view>
<view class="itme">
<ui-icon class="icon" size="22" color="#999" type="gouwuche1"></ui-icon>
<text class="text">{{menu.text3}}</text>
</view>
<view class="itme active">
<ui-icon class="icon" size="22" color="#ff7890" type="my_fill_light"></ui-icon>
<text class="text">{{menu.text4}}</text>
</view>
</view>
效果如图:
 
WX20180602-143509.png
已邀请:

peng

赞同来自:

自定义组件不能使用ui-icon。

首先,ui-icon的样式是在app.wxa文件引入的,编译的样式体现在app.wxss文件中,在app.wxss中的样式只能用于页面。
其次,微信小程序的组件化是有样式隔离机制的,页面的样式并不能作用于组件的。

要回复问题请先登录注册



QQ:378966107

邮箱:frank@uileader.com

微信进交流群 加小助手微信进交流群