微信小程序:Vant Weapp组件库的使用

santu2年前 (2023-02-14)微信小程序767

官方文档:Vant Weapp - 轻量、可靠的小程序 UI 组件库 (gitee.io)



  1. npm初始化,根据需求填写内容,或者一路回车即可。

npm init


2.安装Vant Weapp组件库

npm i vant-weapp -S --production


3.构建npm

4.引入组件

    以 Button 组件为例,只需要在app.json或index.json中配置 Button 对应的路径即可。

// app.json
"usingComponents": {
"van-button": "vant-weapp/button" }

5.使用组件

    引入组件后,可以在 wxml 中直接使用组件

<van-button type="primary">按钮</van-button>

6.注意事项

    如果使用无效,尝试重新打开此项目

7.扫码查看官方模板

qrcode-201808101114.jpg


相关文章

微信小程序:获取用户手机号码

微信小程序:获取用户手机号码

微信小程序可以直接获取用户绑定手机的号码,有几个问题需要注意:大前提,小程序的主体必须是非个人主体;非个人主体必须通过微信公众平台的第三方认证,这个认证是付费服务,300元/年;以上两个条件如果不符合...

微信小程序:API安全处理

微信小程序:API安全处理

前端发往后端的请求,要先经过RSA公钥加密处理,后端收到后使用公钥解密,防止数据被中途拦截修改·在线生成RSA密钥对:http://travistidwell.com/jsencrypt/demo/·...

微信小程序:tdesign组件库的使用

微信小程序:tdesign组件库的使用

新建终端npm initnpm i tdesign-miniprogram -S --production构建npm修改app.json=>删除...