布局

<!--pages/icon/icon.wxml--> <icon class="icon-box-img" type="success" size="50"></icon> <view class="icon-box-title">成功</view> <icon class="icon-box-img" type="info" size="50"></icon> <view class="icon-box-title">提示</view> <icon class="icon-box-img" type="warn" size="50" color="#C9C9C9"></icon> <view class="icon-box-title">普通警告</view> <icon class="icon-box-img" type="warn" size="50"></icon> <view class="icon-box-title">強烈警告</view><icon class="icon-box-img" type="waiting" size="50"></icon> <view class="icon-box-title">等待</view><icon class="icon-small" type="success_no_circle" size="23"></icon> <view class="icon-box-title">多選控件圖標_已選擇</view><icon class="icon-small" type="circle" size="23"></icon><view class="icon-box-title">多選控件圖標_未選擇</view><icon class="icon-small" type="warn" size="23"></icon><view class="icon-box-title">錯誤提示</view><icon class="icon-small" type="success" size="23"></icon><view class="icon-box-title">單選控件圖標_已選擇</view><icon class="icon-small" type="download" size="23"></icon><view class="icon-box-title">下載</view><icon class="icon-small" type="info_circle" size="23"></icon><view class="icon-box-title">提示</view><icon class="icon-small" type="cancel" size="23"></icon><view class="icon-box-title">停止或關閉</view><icon class="icon-small" type="search" size="14"></icon><view class="icon-box-title">搜索</view>

數據模型：

// pages/icon/icon.js 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']},

暫時沒有用到，留著被查

總結

以上是生活随笔為你收集整理的【微信小程序】简洁好用的icon（94/100）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。