icon

图标。

属性名类型默认值说明最低版本
typeStringicon 的类型，有效值：success，success_no_circle，info，warn，waiting，clear，cancel，download，search
sizeNumber24icon 的大小，单位px
colorStringicon 的颜色

示例

  1. <view class="ttui-flex icon-line" tt:for="{{icons}}" tt:for-item="iconline">
  2.     <view class="ttui-flex__item icon-single-wrapper" tt:for="{{iconline}}" tt:for-item="icon">
  3.         <label>
  4.             <icon class="tt-icon" type="{{icon}}"></icon>
  5.             {{icon}}
  6.         </label>
  7.     </view>
  8. </view>
  10. <view class="icon-wrapper" tt:for="{{sizes}}">
  11.     <icon class="tt-icon" size="{{item}}" type="success"></icon>
  12.     <view class="icon-size">{{item}}</view>
  13. </view>
  15. <view class="icon-wrapper" tt:for="{{colors}}">
  16.     <icon class="tt-icon" size="36" color="{{item}}" type="success"></icon>
  17. </view>
  1. // page.js
  2. Page({
  3.     data: {
  4.         icons: [
  5.             ['success', 'success_no_circle'],
  6.             ['info', 'warn'],
  7.             ['waiting', 'clear'],
  8.             ['cancel', 'download'],
  9.             ['search']
  10.         ],
  11.         sizes: [66, 48, 36, 24],
  12.         colors: ['#222222', '#CACACA', '', '#50ABF9']
  13.     }
  14. })

icon - 图1

原文: https://developer.toutiao.com/docs/comp/icon.html