注冊

微信小程序內(nèi)容組件圖標icon,微信小程序圖標示例

2017-12-22
導讀：icon 圖標。 屬性名 類型 默認值 說明 type String icon的類型，有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear size Number 23 icon的大小，單位px color Color icon的顏色，同...

icon

圖標。

屬性名 類型 默認值 說明
type String   icon的類型，有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear
size Number 23 icon的大小，單位px
color Color   icon的顏色，同css的color

示例：

<view class="group">
  <block wx:for="{{iconSize}}">
    <icon type="success" size="{{item}}"/>
  </block>
</view>

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


<view class="group">
  <block wx:for="{{iconColor}}">
    <icon type="success" size="40" color="{{item}}"/>
  </block>
</view>
Page({
  data: {
    iconSize: [20, 30, 40, 50, 60, 70],
    iconColor: [
      'red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple'
    ],
    iconType: [
      'success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear'
    ]
  }
})

 

 


 

更多微信小程序開發(fā)教程，可以關(guān)注hi小程序。
重磅推薦：小程序開店目錄

第一部分：小商店是什么

第二部分：如何開通一個小商店

第三部分：如何登錄小商店

第四部分：開店任務常見問題

第五部分：小商店可以賣什么

第六部分：HiShop小程序特色功能

第七部分：小程序直播

第八部分：小程序收貨/物流

第九部分：小程序怎么結(jié)算

第十部分：小程序客服

第十一部分：電商創(chuàng)業(yè)

第十二部分：小程序游戲開發(fā)