小程序组件 icon组件

icon组件是微信小程序提供的图标组件。借助icon组件,可以更低的资源占用展示更加丰富的内容。

icon 除了公共属性以外,还有3个参数:

对于type来说,只能使用官方提供的这9个类型。size这里要注意了,不是rpx,而是px;

使用场景:

  • 用户操作后的提示
  • 等待过程种的提醒

搜索框里的搜索按钮等。

 来举个例子:

<view>
<block wx:for="{{iconColor}}" wx:key="*this">
<icon type="success" size="40" color="{{item}}"></icon>
</block>
</view>

<view>
<block wx:for="{{iconType}}" wx:key="*this">
<icon type='{{item}}' size='40' color="blue"></icon>
</block>
</view>

这里为data内容:

  data: {
     iconColor:['red','blue','green','black'],
     iconType:['success','success_no_circle','info','warn','waiting']
  },

效果如下:

猜你喜欢

转载自blog.csdn.net/Abudula__/article/details/81202396
今日推荐