vant遇到van-sidebar数据超出不能滑动的问题 vant遇到van-sidebar数据超出不能

van-sidebar数据超出不能滑动

解决方法

最近项目中使用vant的一些总结

List 列表
vant一些内置api也很好用
vant中的toast等代码形式的样式需要额外引入
DatetimePicker 时间选择器
Slider 滑块

van-sidebar数据超出不能滑动问题：项目中使用了van-popup弹出层加载子组件内容，子组件使用了van-sidebar侧边导航

解决方法

lock-scroll：是否锁定背景滚动

//子组件

默认是true，设置为false即可。

最近项目中使用vant的一些总结 vantUi是有赞团队开发的一款针对于小程序及手机端的一款UI框架
使用时非常方便但是其中一些bug也很多把项目中遇到的坑及小tipes分享一下
供自己记忆同时也分享给大家
好好读文档好好读文档好好读文档 !important

List 列表
list列表组件完全是全自动的
自动请求、自动删除loading、页面刷新自动更新。。。
总之在list中你只要做两件事：

在请求数据== 数据库数据时给list一个finished状态
填写你所需要的请求函数

重用list导致的bug

文章图片

在写如上代码时重用list列表 --导致左右击后每次选择条件onload函数会触发两变
bug分析：
【vant遇到van-sidebar数据超出不能滑动的问题】由于每次切换当有的页面加载完成后finished状态会改变，
当其重新开启的时候会触发一次onload函数而我们正常来说也会手动触发一次请求数据
所以在每次请求时候判断一下 finished改变的时候就不要重新手动触发onload函数了
如下：

if (this.page) {sn = 2; this.listForMaine = []; this.startAt = 0; if(this.myFinished){this.myFinished= false; hasChanged = true} } else {sn = 1; this.listForExmation = []; this.startAtExamtion = 0; if(this.myExaminationinished){// changedthis.myExaminationinished= false; hasChanged = true} } if(!hasChanged){this.getSourceDate(sn)}

vant一些内置api也很好用
比如：