XView組件庫下載地址:https://github.com/xwzj12138/Xview
官方文檔:https://xview.weapp.xwzj88.cn
在使用前大家可以掃描二維碼體驗(yàn):
XView小程序組件庫本著簡單易用的原則封裝組件化。使用時只需要將packages目錄下的所有文件放在自己的項(xiàng)目根目錄下缝呕,在需要使用的頁面的json配置文件中引用即可。
頁面展示:
使用案列:
????我們以icon組件庫為例:
????1,在json文件中引用組件
????????{
????????? ????"usingComponents": {
????????? ? ????"x-icon": "/packages/icon/index"
????????????? }
????????}
? ? 2九昧,在頁面中使用組件
????????<x-icon name='like' color='#ed3f14 size='56'></x-icon>
????????<x-icon name='like' color='#ed3f14?size='56' rotate>
? ? 3注整,參數(shù)說明
? ? ? ? ????name:icon的名稱厚柳,默認(rèn)為圓(round)。名稱可以直接在案列頁面(路徑:/pages/icon/)的index.js文件查看或者直接在組件庫(/packages/icon/)的index.wxss目錄中查看项滑。css類名后綴就是icon名稱
? ? ? ? ? ? color:icon的顏色,可根據(jù)需求隨意定制涯贞,默認(rèn)顏色為:#aaa
? ? ? ? ? ? size:icon的大小枪狂,默認(rèn)大小36rpx
? ? ? ? ? ? rotate:是否使用旋轉(zhuǎn)動畫。列如加載刷新圖標(biāo)(loading宋渔,icloading州疾,loading1,loading2皇拣,refresh)可能就需要使用到加載動畫