vant滚动条下滑与下拉刷新冲突问题

业余终结者

于 2021-07-24 20:21:38 发布

阅读量3.3k

点赞数 4

CC 4.0 BY-SA版权

分类专栏：笔记文章标签： vue javascript

本文链接：https://blog.csdn.net/qq_42628798/article/details/119062769

笔记专栏收录该内容

5 篇文章

订阅专栏

本文介绍如何通过在Vant下拉刷新组件中的数据内容div上添加`@touchmove.stop`属性，防止滚动时意外触发下拉刷新功能，提供了解决与滚动冲突的实用解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题描述：

在往下拨动数据进行查看起始数据的时候，往往与vant的下拉刷新的组件冲突，本来是想往下滑动滚动条查看数据，结果老是触发下拉刷新。

解决方案：

在数据内容的div中添加**@touchmove.stop**属性

<van-pull-refresh v-model="isLoading" @refresh="onRefresh">
	<div v-for="item in tableData" :key="item.ID" @touchmove.stop>
    ...
    </div> 
</van-pull-refresh>

参考：
Amour·