pp电子

登录
免费开通

小程序上拉加载scroll-view组件实现要领

凭证官方文档得知,,scroll-view就是内里内容有种种滑动触发事务的p容器,,好比转动条转动、触底、触顶着三个事务。。。。。

 

其中的三个属性  scroll-top:设置转动条的位置

,,scroll-y:是否允许竖向滑动,,height:是组件的高度

Bindscrolltolower是绑定触底触发的事务

Bindscroll  是转动触发的时间

Bindscrolltoupper  触顶触发的事务,由于是触顶触发事务,,以是不对适用来当做下拉刷新

一般来说  关于组件的属性,,都是通过JS来动态控制的。。。。。

<scroll-view scroll-top="{{scrollTop}}" scroll-y="true" style="height:{{scrollHeight}}px;" bindscrolltolower="bindDownLoad" bindscroll="scroll">

    这内里可以加一些loading 组件 和 需要遍历的数据

</scroll-view>

这内里我们要用到的就是 Bindscrolltolower 事务 来实现pp电子 上拉加载。。。。。

下面我们来说说怎样实现:

首先我们需要把 page 页码设置为全局变量  let page

然后再 bindDownLoad 函数内里举行 page++ 的赋值

bindDownLoad:function(){

    page++

    wx.request({

        //这内里的工具就不详细说了 各人应该能在API中找到

        主要说一下 在我们乐成的获取到data 的时间 需要我们在success 乐成回调内里去动态的push 我们所获取到的新的

        data  然后 setData 给我们 的dataList 这样就不会泛起每次加载完成都是新数据而旧数据被销毁的情形。。。。。

        尚有一点需要注重的就是当数据获取到最后一条数据以后 需要 举行一个if 判断 或者 switch 判断

    })

}

简朴的介绍了一下 上拉加载  需要各人上机测试,,祝你们乐成!

小程序上拉加载scroll-view组件实现要领


【本站声明】
  1、本站文章中所选用的图片及文字泉源于网络以及用户投稿,,由于未联系到知识产权人或未发明有关知识产权的挂号,,若有知识产权人并不肯意我们使用,,若是有侵权请连忙联系。。。。。
  2、本网站差池文章中所涉及的内容真实性、准确性、可靠性认真,,仅系客观性形貌,,如您需要相识该类商品/服务详细的资讯,,请您直接与该类商品/服务的提供者联系。。。。。


KESION pp电子软件

KESION pp电子软件是海内领先的在线教育软件及私域社交电商软件服务提供商,,恒久专注于为企业提供在线教育软件及社交电商SaaS平台解决方案。。。。。
公司焦点产品云开店SaaS社交电商服务平台、在线教育SaaS服务平台、教育企业数字化SaaS云平台、企微营销助手、私有化自力安排品牌网校和在线教育咨询等。。。。。

KESION 一直通过手艺立异,,提供产品和服务,,助力企业向数字化转型,,通过科技驱动商业刷新,,让商业变得更智慧!



▼点击进入pp电子官网相识更多



热门标签
SaaS
上/下篇
  • 微信小程序API动画,wx.createAnimation建设一个动画实例

  • 微信小程序API位置,wx.pageScrollTo将页面转动到目的位置

换一换相关推荐
精选内容
热门精选
pp电子·模拟器(试玩游戏)官方网站 pp电子·模拟器(试玩游戏)官方网站 pp电子·模拟器(试玩游戏)官方网站
【网站地图】
小程序上拉加载scroll-view组件实现要领 - KES