微信小程序——icon组件

icon组件

图标。组件属性的长度单位默认为px。

icon.wxml文件

<!--pages/icon/icon.wxml-->
 <view class="container">
     <view class="group">
        <block wx:for="{{iconSize}}">
            <icon type="success" size="{{item}}"/>
        </block>
     </view>


     <view>
       <block wx:for="{{iconType}}">
          <icon type="{{item}}" size="45"/>
       </block>
     </view>

     <view>
       <block wx:for="{{iconColor}}">
          <icon type="success" size="45" color="{{item}}"/>
       </block>
     </view>
 
 </view>

icon.js文件

Page({

  /**
   * 页面的初始数据
   */
  data: {
     iconSize:[20,30,40,50,60,70],
     iconColor:[
       'red','orange','yellow','green','rgb(0,255,255)','blue','purple','#ccc'
     ],
      iconType:[
        'success','info','warn','waiting','safe_success','safe_warn','success_circle','success_no_circle','circle','download','info_circle','cancel','search','clear'
      ]
  }

})

效果图