注冊(cè)

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

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

icon

圖標(biāo)。

屬性名 類型 默認(rèn)值 說(shuō)明
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'
    ]
  }
})

 

 


 

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

第一部分：小商店是什么

第二部分：如何開(kāi)通一個(gè)小商店

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

第四部分：開(kāi)店任務(wù)常見(jiàn)問(wèn)題

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

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

第七部分：小程序直播

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

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

第十部分：小程序客服

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

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