最近撸了一个个人小程序项目,前端到后端都是本人所写,苦逼。。。废话不多说,直接给大家说一下uniapp使用vant步骤!!!
一、创建目录
- 在项目根目录中创建wxcomponents目录(注:与components同路径)
- 在wxcomponents目录中创建vant目录
- 在vant-weapp的GitHub Releases版块下载最新的zip包:https://github.com/youzan/vant-weapp/releases
- 把下载好的zip包中的dist文件目录放到vant目录下。
效果:
二、使用组件
1.在App.Vue目录中的style部分引入UI组件库的样式文件:
<style>
@import "/wxcomponents/vant/dist/common/index.wxss";
</style>
2.在pages.json配置文件的style中,注册页面需要的组件
"globalStyle": {
"usingComponents":{
"van-button":"/wxcomponents/vant/dist/button/index"
}
}
3.在页面中使用组件
例如:<van-button type="primary">主要按钮</van-button>
收工!!!觉得有帮助,顺便给博主一个赞吧————