专业资源平台

扫一扫

秒变设计达人

首页 小程序 正文
我要投稿
微信小程序－刷新加载

微信小程序－刷新加载

2021-03-12
¥ 0 元 终身VIP免费 升级终身VIP
点赞 (0) 收藏 (0)
立即下载
升级会员
下载不了？请联系网站客服提交链接错误！
增值服务： 安装指导 环境配置 二次开发 网站建设 模板修改 源码安装 LOGO设计 图片设计
微信小程序－刷新加载
最近更新 2021年03月12日
资源编号 12807
当前信息若含有黄赌毒等违法违规不良内容，请点此举报！

微信小程序－刷新加载

2021-03-12 小程序 0 百度已收录
郑重承诺丨总裁主题提供安全交易、信息保真!
升级会员
增值服务：
安装指导
环境配置
二次开发
网站建设
模板修改
源码安装
¥ 0 元 （终身VIP免费 升级终身VIP） 开通VIP尊享优惠特权
点赞 (0) 收藏 (0)
立即下载 升级会员 最新活动

QQ 微信

微信

进入TA的商铺 联系官方客服
详情介绍
又是一天，继续小程序之旅，这一次把项目优化了一下布局，不至于那么丑了，然后实现了上拉加载更多，下拉刷新，需要滚轮操作才可以，鼠标多拽好像不灵活。效果图

微信小程序－刷新加载

简单的说一下实现我的实现思路：

布局

  1. <scroll-view  style=”height: {{windowHeight}}px; width: {{windowWidth}}px;” scroll-y=”true” bindscrolltoupper=”pullDownRefresh” bindscrolltolower=”pullUpLoad” >
  2.   <navigator url=”../newDetail/newDetail?id={{item.menuId}}” redirect=”false” wx:for=”{{caiItems}}” hover-class=”navigator-hover”>
  3.       <view class=”test_item”>
  4.       <image class=”item_img” src=”{{item.thumbnail}}” mode=”scaleToFill”></image>
  5.       <text class=”item_content”>{{item.name}}</text>
  6.       </view>
  7. </navigator>
  8. </scroll-view>

核心就是：

  1. “`
  2. style=”height: {{windowHeight}}px; width: {{windowWidth}}px;” scroll-y=”true” bindscrolltoupper=”pullDownRefresh” bindscrolltolower=”pullUpLoad”

JS中实现相对应的方法

  1. <font face=”微软雅黑”> onShow: function( e ) {
  2.     wx.getSystemInfo( {
  3.       success: ( res ) => {
  4.         this.setData( {
  5.           windowHeight: res.windowHeight,
  6.           windowWidth: res.windowWidth
  7.         })
  8.       }
  9.     })
  10.   },
  11.   pullDownRefresh: function( e ) {
  12.     console.log( “下拉刷新….” )
  13.     this.onLoad()
  14.   },
  16.   pullUpLoad: function( e ) {
  17.     this.setData( {
  18.       page: this.data.page + 1
  19.     })
  21.     console.log( “上拉拉加载更多….” + this.data.page )
  23.     this.getDataFromServer( this.data.page )
  24.   },
  26. }</font>
资源下载此资源仅限注册用户下载，请先
客服QQ：3482249445
收藏 (0) 打赏

感谢您的支持，我会继续努力的!

打开微信/支付宝扫一扫，即可进行扫码打赏哦，分享从这里开始，精彩与您同在
点赞 (0)

所有文章为演示数据，不提供下载地址，版权归原作者所有，仅提供演示效果！

小程序网 小程序 微信小程序－刷新加载 https://www.10000ii.com/12807.html

生成海报
上一篇： 微信小程序－news
下一篇： 微信小程序－左滑动功能
常见问题

免费下载或者VIP会员专享资源能否直接商用？

  • 本站所有资源版权均属于原作者所有，这里所提供资源均只能用于参考学习用，请勿直接商用。若由于商用引起版权纠纷，一切责任均由使用者承担。
查看详情

提示下载完成但无法解压？

  • 最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量，若小于网盘提示的容量则是这个原因。这是浏览器下载的bug，建议用
查看详情

相关文章

【新版影视小程序源码】破解域名授权+非框架版
【新版影视小程序源码】破解域名授权+非框架版
【影视电影小程序】2021修复完整运营版+流量主激励广告
【影视电影小程序】2021修复完整运营版+流量主激励广告
叮咚活动报名小程序高级版V5.2.3
叮咚活动报名小程序高级版V5.2.3
狮子鱼社区团购小程序V5.1.6完整包源码
狮子鱼社区团购小程序V5.1.6完整包源码
猜你喜欢
小程序网

分享最新小程序教程共同学习，共同进步，共同成长！

QQ交流群
小程序网

QQ交流群

你好。点击以下按钮加入QQ交流群，我们一起共同进步，共同成长！


热门文章
终身VIP会员限时钜惠
首页 活动 会员 商城 我的
微信小程序－刷新加载-海报

分享本文封面

分享到人人 分享到 Q Q 分享到空间 分享到微博 下载封面