Vant小程序组件
1、自己封装的gitee Vant
链接:https://vant-contrib.gitee.io/vant/#/zh-CN/
点击切换小程序
成功后就会看到 小程序Ul组件库
构建 npm 包
打开微信开发者工具,点击 工具 -> 构建 npm,并勾选 使用 npm 模块 选项,构建完成后,即可引入组件
引入在 app.wxss 中引入内置样式
@import '@vant/weapp/common/index.wxss';
例子:
需在创建的pages的目录中的文件夹以index为列子
引入“”搜索框”在index.json中引入组件,
index.json中
"usingComponents": {
"van-search": "@vant/weapp/search/index"
}
index.wx.html中C+V组件
小程序WeUl组件库
1、创建文件夹打开cmd,在小程序根目录内,初始化npm
npm init -y
2、执行命令安装 npm 包:
以微信官方WEUI组件库为示例
npm install --save weui-miniprogram
3、安装完成后,在微信开发者工具中的菜单栏:详情-----使用npm模块-----工具 ------ 构建 npm :
扫描二维码关注公众号,回复:
11581976 查看本文章
4、app.wxss引入全局样式
@import '/miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';
5、以pages的index为例,json中引入cell:
{
"usingComponents": {
"mp-cell": "../../miniprogram_npm/weui-miniprogram/cell/cell "
}
}
1
6、点击文档中的组件示例代码,开始 C + V
官方文档链接(这里是Slideview):
链接: https://developers.weixin.qq.com/miniprogram/dev/extended/weui/slideview.html.