首先先介绍一下使用组件
下拉刷新用的是<van-pull-refresh>组件
<van-pull-refresh
class="refresh-container"
v-model="refreshLoading"
@refresh="handleRefreshLoading"
success-text="刷新成功"
>
</van-pull-refresh>
弹出层用的是<van-popup>组件
<van-popup closeable v-model="showPopup">
</van-popup>
下拉刷新的组件有一个disabled属性,disabled设置为true时可阻止下拉刷新
也就是说当弹出popup的时候 showPopup为true的时候 设置disabled为true,
关闭popup showPopup为false的时候设置disabled为false即可恢复下拉刷新
// 下拉刷新
<van-pull-refresh
class="refresh-container"
v-model="refreshLoading"
@refresh="handleRefreshLoading"
success-text="刷新成功"
:disabled="disabled"
>
</van-pull-refresh>
// 弹出层
<van-popup closeable v-model="showPopup">
</van-popup>
data() {
return {
disabled: false,
showPopup: false,
};
},