XView组件库下载地址:https://github.com/xwzj12138/Xview
官方文档:https://xview.weapp.xwzj88.cn
在使用前大家可以扫描二维码体验:
XView小程序组件库本着简单易用的原则封装组件化。使用时只需要将packages目录下的所有文件放在自己的项目根目录下,在需要使用的页面的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,参数说明
name:icon的名称,默认为圆(round)。名称可以直接在案列页面(路径:/pages/icon/)的index.js文件查看或者直接在组件库(/packages/icon/)的index.wxss目录中查看。css类名后缀就是icon名称
color:icon的颜色,可根据需求随意定制,默认颜色为:#aaa
size:icon的大小,默认大小36rpx
rotate:是否使用旋转动画。列如加载刷新图标(loading,icloading,loading1,loading2,refresh)可能就需要使用到加载动画
网友评论