微信小程序icon組件使用詳解
更新時間：2018年01月31日 10:04:30 作者：Rattenking
這篇文章主要為大家詳細(xì)介紹了微信小程序icon組件的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下
微信小程序icon組件的實現(xiàn)，具體如下
原生的icon組件的屬性
WXML
<view class="icon-group">
<icon wx:for="{{typeList}}" type="{{item}}" size="40"></icon>
</view>
JS
Page({
data: {
typeList: ['success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear']
},
})
引入圖標(biāo)庫
方法
微信小程序—-引入外部字體庫iconfont的圖標(biāo)
WXML
<view class="icon-group">微信小程序外部庫引入圖標(biāo)</view> <view class="icon-group"> <icon class="iconfont icon-zhiding"></icon> <icon class="iconfont icon-zuojiantou"></icon> <icon class="iconfont icon-youjiantou"></icon> <icon class="iconfont icon-shangjiantou"></icon> <icon class="iconfont icon-xiajiantou1"></icon> <icon class="iconfont icon-xiajiantou"></icon> </view> <view class="icon-group"> <icon class="iconfont icon-gengduotianchong"></icon> <icon class="iconfont icon-erweima"></icon> <icon class="iconfont icon-fenleiorguangchangorqita"></icon> <icon class="iconfont icon-dibiao"></icon> <icon class="iconfont icon-bangzhu"></icon> <icon class="iconfont icon-xinfeng"></icon> </view> <view class="icon-group"> <icon class="iconfont icon-duihuaxinxi"></icon> <icon class="iconfont icon-sousuo"></icon> <icon class="iconfont icon-shouye"></icon> <icon class="iconfont icon-shezhi"></icon> <icon class="iconfont icon-shanchu"></icon> <icon class="iconfont icon-dianhua"></icon> </view>
DEMO下載
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了ES6 對象的新功能與解構(gòu)賦值介紹，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-02-02
實現(xiàn)JavaScript中數(shù)據(jù)響應(yīng)的方法總結(jié)
JavaScript 數(shù)據(jù)響應(yīng)是一種重要的前端開發(fā)概念,是指在應(yīng)用程序中的數(shù)據(jù)發(fā)生變化時,能夠自動更新與這些數(shù)據(jù)相關(guān)的用戶界面（UI）部分的能力,本文我們來總結(jié)一下目前可以簡單實現(xiàn) JavaScript 中的數(shù)據(jù)響應(yīng)的方法,需要的朋友可以參考下2023-09-09
這篇文章主要為大家介紹了js獲取兩個數(shù)組對象的差集實現(xiàn)方法,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
詳解如何使用JavaScript獲取自動消失的聯(lián)想詞
前幾天在做數(shù)據(jù)分析時,我嘗試獲取某網(wǎng)站上輸入搜索詞后的聯(lián)想詞,輸入搜索詞后會彈出一個顯示聯(lián)想詞的框,有趣的是,輸入框失去焦點(diǎn)后,聯(lián)想詞彈框就自動消失了,這種情況下該怎么辦呢,所以本文給大家介紹了如何使用JavaScript獲取自動消失的聯(lián)想詞,需要的朋友可以參考下2024-06-06
記一次webpack3升級webpack4的踩坑經(jīng)歷
這篇文章主要介紹了記一次webpack3升級webpack4的踩坑經(jīng)歷，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
這篇文章主要介紹了微信小程序引入Vant組件庫過程解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-08-08
Bootstrap每天必學(xué)之彈出框（Popover）插件
Bootstrap每天必學(xué)之彈出框（Popover）插件,彈出框的內(nèi)容完全可使用 Bootstrap 數(shù)據(jù) API（Bootstrap Data API）來填充，如何實現(xiàn)請參考本文2016-04-04
本篇文章主要是對Script標(biāo)簽與訪問HTML頁面進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-01-01
簡單寫了下，只測試了chrome，道理很簡單，其他瀏覽器自行擴(kuò)充。2013-05-05
在JavaScript中，等號由雙等號(==)表示，當(dāng)且僅當(dāng)兩個運(yùn)算數(shù)相等時，它返回true。今天我們就來詳細(xì)探討下等號運(yùn)算符的問題，并附上等號運(yùn)算符和全等號運(yùn)算符的區(qū)別分析。2015-04-04