目录van-sidebar数据超出不能滑动解决方法最近项目中使用vant的一些总结List 列表vant一些内置api也很好用vant中的toast等代码形式的样式需要额外引入Dat
问题:项目中使用了van-popup弹出层加载子组件内容,子组件使用了van-sidebar侧边导航
lock-scroll
:是否锁定背景滚动<van-popup v-model="showLaodingport" position="bottom" :style="{ height: '100%'}" :lock-scroll="false">
//子组件
<loadingPort @child="fromLoadingport"/>
</van-popup>
默认是true,设置为false即可。
vantUi是有赞团队开发的一款针对于小程序及手机端的一款UI框架
使用时非常方便 但是其中一些bug也很多 把项目中遇到的坑及小tipes分享一下
供自己记忆同时也分享给大家
好好读文档 好好读文档 好好读文档 !important
list列表组件完全是全自动的
自动请求、自动删除loading、页面刷新自动更新。。。
总之在list中你只要做两件事:
重用list导致的bug
在写如上代码时重用list列表 --导致左右击后每次选择条件onload函数会触发两变
bug分析:
由于每次切换当有的页面加载完成后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){
// changed
this.myExaminationinished= false;
hasChanged = true
}
}
if(!hasChanged){
this.getSourceDate(sn)
}
比如:
通过ref绑定详细请阅读文档
如:
import { Toast } from 'vant';
然后再使用,否则会报错
这个组件可以精确到分钟 已经很好用了
其中有一个选项可以实现双滑块很舒服
妈妈再也不让我写原生了
以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。
--结束END--
本文标题: vant遇到van-sidebar数据超出不能滑动的问题
本文链接: https://www.lsjlt.com/news/147311.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0