图标有哪些属性,如何通过代码实现图标_移动开发平台 mPaaS(mPaaS)-阿里云帮助中心

图标。

属性名	类型	默认值	描述	最低版本
type	String	-	icon 类型，有效值：info、warn、waiting、cancel、download、search、clear、success、success_no_circle、loading。	loading (1.7.2)
size	Number	23	icon 大小，单位 px	-
color	Color	-	icon 颜色，同 CSS 的 color	-

图示

代码示例

<block a:for="{{iconType}}">
  <view class="item">
    <icon type="{{item}}" aria-label="{{item}}" size="45"/>
    <text>{{item}}</text>
  </view>
</block>
<block a:for="{{iconSize}}">
  <view class="item">
    <icon type="success" size="{{item}}"/>
    <text>{{item}}</text>
  </view>
</block>
<block a:for="{{iconColor}}">
  <view class="item">
    <icon type="success" size="45" color="{{item}}"/>
    <text style="color:{{item}}">{{item}}</text>
  </view>
</block>

Page({
  data: {
    iconSize: [20, 30, 40, 50, 60],
    iconColor: [
      'red', 'yellow', 'blue', 'green'
    ],
    iconType: [
      'success',
      'info',
      'warn',
      'waiting',
      'clear',
      'success_no_circle',
      'download',
      'cancel',
      'search',
    ]
  }
})