在mpvue框架中使用Vant WeappUI组件库的注意事项【推进】


Posted in Javascript onJune 09, 2019

1如何引入组件库

有两种方法 1 npm下载 2 下载代码,下面介绍第二种方法。

在gitHub上, 链接如下  https://github.com/youzan/vant-weapp  首先在自己项目目录static下新建一个vant文件夹,用于存放组件文件,把dist文件夹下的所有文件拷贝到static下面的vant目录下,如下所示:

在mpvue框架中使用Vant WeappUI组件库的注意事项【推进】

2 如何使用

1 在需要使用组件的页面所在的文件夹下新建一个页面main.json, (新建页面后必须npm run dev 才能生效)在其中引入相应的组件即可,如下图所示引入了van-popup组件和van-picker组件:

在mpvue框架中使用Vant WeappUI组件库的注意事项【推进】

2 在对应的页面中使用, 这个页面使用了van-popup组件和van-picker组件。在弹层中选择年份。

在mpvue框架中使用Vant WeappUI组件库的注意事项【推进】

3 注意事项

popup的事件命名中使用了减号, 直接使用会导致组件不生效,解决方法如下: 找到vant目录下popup目录下的index.js文件(就是上面所说的在static下面新建的vant),修改其中的事件名,如下注释部分,把短横线命名改为驼峰命名,即可生效。

在mpvue框架中使用Vant WeappUI组件库的注意事项【推进】

3 到这里就可以在页面中使用了相应的组件了。

总结

以上所述是小编给大家介绍的在mpvue框架中使用Vant WeappUI组件库的注意事项,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
静态图片的十一种滤镜效果--不支持Ie7及非IE浏览器。
Mar 06 Javascript
浅析Js中的单引号与双引号问题
Nov 06 Javascript
jQuery 无刷新分页实例代码
Nov 12 Javascript
js实现的GridView即表头固定表体有滚动条且可滚动
Feb 19 Javascript
javascript的事件触发器介绍的实现
Jun 05 Javascript
Highcharts入门之基本属性
Aug 02 Javascript
EditPlus 正则表达式 实战(3)
Dec 15 Javascript
解决浏览器会自动填充密码的问题
Apr 28 Javascript
javascript计算渐变颜色的实例
Sep 22 Javascript
详解微信小程序之scroll-view的flex布局问题
Jan 16 Javascript
JS实现按比例缩小图片宽高
Aug 24 Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
Sep 08 Javascript
微信小程序发布新版本时自动提示用户更新的方法
Jun 07 #Javascript
微信小程序与webview交互实现支付功能
Jun 07 #Javascript
在微信小程序中使用vant的方法
Jun 07 #Javascript
微信小程序实现折线图的示例代码
Jun 07 #Javascript
微信小程序如何刷新当前界面的实现方法
Jun 07 #Javascript
关于微信小程序获取小程序码并接受buffer流保存为图片的方法
Jun 07 #Javascript
vue集成kindeditor富文本的实现示例代码
Jun 07 #Javascript
You might like
php数组总结篇(一)
2008/09/30 PHP
php echo, print, print_r, sprintf, var_dump, var_expor的使用区别
2013/06/20 PHP
PHP 解决session死锁的方法
2013/06/20 PHP
php批量删除数据库下指定前缀的表以prefix_为例
2014/08/24 PHP
php保存信息到当前Session的方法
2015/03/16 PHP
php获取文件后缀的9种方法
2016/03/22 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
用javascript获取地址栏参数
2006/12/22 Javascript
JavaScript中的Document文档对象
2008/01/16 Javascript
摘自启点的main.js
2008/04/20 Javascript
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
2009/02/17 Javascript
Web前端设计模式  制作漂亮的弹出层
2010/10/29 Javascript
Jquery中getJSON在asp.net中的使用说明
2011/03/10 Javascript
如何使用jquery修改css中带有!important的样式属性
2016/04/28 Javascript
JavaScript判断页面加载完之后再执行预定函数的技巧
2016/05/17 Javascript
canvas时钟效果
2017/02/16 Javascript
JavaScript设计模式之策略模式详解
2017/06/09 Javascript
JavaScript函数、闭包、原型、面向对象学习笔记
2018/09/06 Javascript
jQuery实现可以计算进制转换的计算器
2020/10/19 jQuery
Python设计模式之观察者模式实例
2014/04/26 Python
Python的gevent框架的入门教程
2015/04/29 Python
在Django框架中伪造捕捉到的URLconf值的方法
2015/07/18 Python
在python的类中动态添加属性与生成对象
2016/09/17 Python
Django框架使用富文本编辑器Uedit的方法分析
2018/07/31 Python
使用python实现回文数的四种方法小结
2019/11/24 Python
python des,aes,rsa加解密的实现
2021/01/16 Python
享誉全球的多元化时尚精品购物平台:Farfetch发发奇(支持中文)
2017/08/08 全球购物
Hudson Jeans官网:高级精制牛仔裤
2018/11/28 全球购物
LORAC官网:美国彩妆品牌
2019/08/27 全球购物
个人应聘自我评价分享
2013/11/18 职场文书
企业厂务公开实施方案
2014/03/26 职场文书
领导干部作风建设工作总结
2014/10/23 职场文书
开展党的群众路线教育实践活动工作总结
2014/11/05 职场文书
安全员岗位职责
2015/02/10 职场文书
导游词之五台山
2019/10/11 职场文书
SQLServer2008提示评估期已过解决方案
2021/04/12 SQL Server