0
点赞
收藏
分享

微信扫一扫

微信小程序开发页面下拉刷新和scrollview

问题背景

本文主要介绍微信小程序开发过程实现页面下拉刷新以及scrollview组件实现下拉刷新,以及二者的关系。

问题分析

微信小程序开发过程,如果要实现页面刷新以及scrollerview下拉刷新,步骤如下: (1)页面独立配置 在对应页面的json文件中配置属性:

"enablePullDownRefresh":true

(2)项目整体配置 在app.json中window对应内容增加属性配置:

  "window": {
    ...,
    "enablePullDownRefresh":true
  },

(3)scrollerview配置下拉刷新:

<scroll-view class="scroll-view_H" scroll-y="true" refresher-enabled="true" 
    bindrefresherrefresh="handleRefresher" refresher-triggered="{{isTriggered}}">
    //如果只开启refresher-enabled="true" 页面只会下拉刷新,但是不会回去,下拉刷新的图标一直存在,为false后会退出刷新

(4)系统页面下拉刷新和scrollerview的下拉会冲突,页面下拉刷新会被禁用。 image.png

问题总结

本文主要介绍微信小程序开发过程实现页面下拉刷新以及scrollview组件实现下拉刷新,以及二者的关系,有兴趣的同学可以进一步深入研究。

举报

相关推荐

0 条评论