[微信小程序] scroll-view组件下拉刷新,怎样结束刷新(已解决)

这篇具有很好参考价值的文章主要介绍了[微信小程序] scroll-view组件下拉刷新,怎样结束刷新(已解决)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

官方文档:scroll-view | 微信开放文档 (qq.com)

这里就不赘述scroll-view的基本使用方法了,先看问题:

scroll-view 下拉刷新,微信小程序,小程序

 代码:

scroll-view 下拉刷新,微信小程序,小程序

 由于在官方文档中并没有详细说明如何在刷新完成之后关闭刷新,这里我给出的解决办法就是,给组件绑定一个刷新数据,然后在触发下拉刷新的函数中手动将数据改为刷新完成,其中用到的属性为:

scroll-view 下拉刷新,微信小程序,小程序

 

scroll-view 下拉刷新,微信小程序,小程序

 其中触发的回调函数代码为:

  bindrefresherrefresh(e){
    console.log(e);
    setTimeout(()=>{
      this.setData({
        isFresh : false
      })
    },1000)

定时器setTimeout为模拟异步函数,在回调函数中的逻辑代码执行完毕之后,手动让组件结束刷新即可文章来源地址https://www.toymoban.com/news/detail-807886.html

到了这里,关于[微信小程序] scroll-view组件下拉刷新,怎样结束刷新(已解决)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序scroll-view组件设置 scroll-top无效问题解决

    微信小程序官方提供了一个可以设置滚动条位置的方法 scroll-top 在实际运用过程中,发现设置了scroll-top无效,滚动条位置并没有发生变化,是因为微信小程序的官方框架处于性能考虑,初始化设置scroll-top不会重新渲染页面,需要将scroll-top的是放在一个事件内执行才可以生效

    2024年02月11日
    浏览(53)
  • 微信小程序 scroll-view 组件的 bindscroll 不触发不生效

    使用微信小程序基础组件中的scroll-view,但是滑动的时候 bindscroll 一直不生效。 在网上查了资料,发现了几类不生效的原因,总结如下: 1、没有设置高度,根据小程序文档,在使用 scroll-view 组件用于竖向滚动时一定要设置高度。 2、没有设定scroll-y 3、组件属性的长度单位默

    2024年02月11日
    浏览(32)
  • 【微信小程序】-- 常用视图容器类组件介绍 -- view、scroll-view和swiper(六)

    💌 所属专栏:【微信小程序开发教程】 😀 作  者:我是夜阑的狗🐶 🚀 个人简介:一个正在努力学技术的CV工程师,专注基础和实战分享 ,欢迎咨询! 💖 欢迎大家:这里是CSDN,我总结知识的地方,喜欢的话请三连,有问题请私信 😘 😘 😘   大家好,又见面了,

    2024年01月18日
    浏览(38)
  • 微信小程序组件scroll-view滚动到底部多次触发加载如何解决?

    在 iOS 真机上,scroll-view 滚动时会多次触发 scrolltolower 事件的问题,可以设置一个“加载标识”(如 DisableTrigger)来避免重复请求下一页数据。具体做法为: 在 data 中新增一个 DisableTrigger 变量,用于标识当前是否可以执行下一页数据的加载操作。 在 init()方法中,在请求数据

    2024年02月13日
    浏览(35)
  • 【微信小程序】动态修改page的wxss样式/scroll-view使用/监听子组件

    静态写法 直接使用下面的写法,是静态的。 动态写法 在wxml最外层套一个自己定义的page的class。 如果想修改.page的样式,再用普通的动态class判断改变就可以了。 例如:改变背景颜色 参考:微信小程序如何动态修改page标签的css样式 设置id时需要注意下:id 的设置要求是字母

    2024年02月05日
    浏览(36)
  • 关于uniapp微信小程序scroll-view组件使用show-scrollbar隐藏不了滚动条

    这里关于使用  scroll-view组件  时候有滚动条 想要隐藏滚动条但是使用show-scrollbar没有效果 这时候又使用类名隐藏滚动条 使用id隐藏滚动条都不行 解决方法:在使用  scroll-view组件 的页面或者app 页面加上以下代码就可以了         

    2024年02月12日
    浏览(30)
  • uniapp scroll-view用法[下拉刷新,触底事件等等...](4)

    话不多说 直接上官网属性  官网示例  讲一下常用的几个 @scroll  滚动时触发  @scrolltoupper 滚动到顶部或左边,会触发 scrolltoupper 事件 @scrolltolower   滚动到底部或右边,会触发 scrolltolower 事件 1.纵向滚动 设置scroll-y=\\\"true\\\"  开启纵向滚动功能 2.横向滚动 设置scroll-x=\\\"true\\\"  开

    2024年01月25日
    浏览(39)
  • uniapp使用自带【刷新方法】与使用【scroll-view】实现下拉刷新上拉加载

    前言:uniapp自带下拉刷新,上拉加载功能基本可以满足刷新需求,但是顶部有状态栏的页面就得进行特殊处理,使用scroll-view解决,状态栏会连带被下拉问题   1、uniapp自带下拉刷新、上拉加载 在page.json中对应页面路由设置【enablePullDownRefresh】值为true(开启下拉刷新) 代码:

    2024年02月11日
    浏览(33)
  • 微信小程序 scroll-view

    微信官方文档地址:https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html 微信小程序 scroll-view 提示:以下是本篇文章正文内容,下面案例可供参考 可滚动视图区域 。 代码如下(示例): 提示:css 提示:scroll-view 属性 提示:设置自定义下拉刷新区域背景颜色

    2024年02月11日
    浏览(34)
  • 【微信小程序】scroll-view滚动

    wxml文件 wxss文件       wxml文件 wxss文件     注意事项: 1、在scroll-view标签上加上样式属性: display:flex; white-space:nowrap; 2、scroll-view标签下的一级栏目标签需要加上样式属性: display: inline-block; 只有结合上面两步,才能实现横向滚动。

    2024年02月13日
    浏览(32)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包