vux (scroller)上拉刷新、下拉加载更多
1)比较关键的地方是要在 scroller 组件上里加一个 ref 属性
<scroller :lockX=true height="-170" :pulldown-config="{downContent: '下拉刷新', upContent: '释放后更新'}" :pullup-config="{upContent:'上拉加载更多', downContent: '释放后加载'}" ref="myScroller" :use-pulldown=true :use-pullup=true @on-pulldown-loading="pageNo = 1;getArticleList(1, catId)" @on-pullup-loading="getArticleList(1, catId)">
</scroller>
如上,我加一个叫 myScroller 的 ref 属性,下面可以通过这个东西来调用组件的方法
2)上拉刷新,下拉加载(let _this = this)
if (data.Code !== 0) return false
if (_this.pageNo === 1) {
_this.ArticleList = data.Result.ArticleList
_this.$nextTick(() => {
_this.$refs.myScroller.donePulldown()
_this.$refs.myScroller.reset({top: 0})
})
} else {
let _count = _this.ArticleList.length
for (var i = data.Result.ArticleList.length - 1; i >= 0; i--) {
_this.ArticleList[_count + i] = data.Result.ArticleList[i]
}
_this.$nextTick(() => {
_this.$refs.myScroller.donePullup()
_this.$refs.myScroller.reset()
})
}
完
vux (scroller)上拉刷新、下拉加载更多的更多相关文章
- juery下拉刷新,div加载更多元素并添加点击事件(二)
buffer.append("<div class='col-xs-3 "+companyId+"' style='padding-left: 10px; padd ...
- Android 自定义 ListView 上下拉动“刷新最新”和“加载更多”歌曲列表
本文内容 环境 测试数据 项目结构 演示 参考资料 本文演示,上拉刷新最新的歌曲列表,和下拉加载更多的歌曲列表.所谓"刷新最新"和"加载更多"是指日期.演示代码 ...
- jQuery模拟原生态App上拉刷新下拉加载
jQuery模拟原生态App上拉刷新下拉加载效果代码,鼠标上拉时会显示loading字样,并且会模拟加载一条静态数据,支持触屏设备使用. <!doctype html> <html ...
- Android之 RecyclerView,CardView 详解和相对应的上拉刷新下拉加载
随着 Google 推出了全新的设计语言 Material Design,还迎来了新的 Android 支持库 v7,其中就包含了 Material Design 设计语言中关于 Card 卡片概念的 ...
- Flutter学习笔记(25)--ListView实现上拉刷新下拉加载
如需转载,请注明出处:Flutter学习笔记(25)--ListView实现上拉刷新下拉加载 前面我们有写过ListView的使用:Flutter学习笔记(12)--列表组件,当列表的数据非常多时,需 ...
- 微信小程序 上拉刷新/下拉加载
小程序项目中上拉刷新下拉加载是比较常见的需求,官方文档也提供了相当友好的API,但是因为API隐藏的比较深,文档描述也比较模糊所以也折腾了一番(官方文档),在此记录一下使用方式 onPullDownR ...
- ListView上拉刷新和分页加载完整的Dome
很多人工作的过程中都会碰到ListView下拉刷新和分页加载,然后大多数公司都已经把框架写好了,大家直接用就可以了,有些人一直对这个事情处于迷茫状态,为了让大家对上拉刷新和分页加载有一个比较全面的认识 ...
- jQuery WeUI 组件下拉刷新和滚动加载的实现
最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...
- 实现app上对csdn的文章列表上拉刷新下拉加载以及加入缓存文章列表的功能 (制作csdn app 四)
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/23698511 今天继续对我们的csdn客户端未完成的功能进行实现,本篇博客接着客 ...
- 第三方 XListview 上拉加载、下拉刷新、分页加载和Gson解析
注意:此Demo用的是第三方的Xlistview.jar,需要复制me文件夹到项目中,两个XML布局文件和一张图片 把下面的复制到String中 <string name="xlist ...
随机推荐
- HashTable和HashMap的区别详解
一.HashMap简介 HashMap是基于哈希表实现的,每一个元素是一个key-value对,其内部通过单链表解决冲突问题,容量不足(超过了阀值)时,同样会自动增长. HashMap是非线程安全的, ...
- webpack6--css 背景图片处理
当css里面含有背景图片,用webpack打包时会报如下错: 如何处理这个问题呢? 我们需要借助于 file-loader 和 url-loader 这2个包. 下面具体说一下步骤: 1.安装 fi ...
- IIS字体文件添加MIME映射
在前端经常会做这样一件事情,页面会加载一些特殊的字体或者是图标文件,常用的比如:.woff.woff2..ttf..svg..otf..eot...如果没有添加MIME映射会报404的错误,IIS错误 ...
- Windows安装Tomcat失败:Failed installing tomcat7 service
今天在Win7下面安装tomcat(解压版),但是安装的时候老是弹出:Failed installing tomcat6 service.猜想是Win7安全权限管理的原因.网上搜了一下果然是这样. 解 ...
- Claims-Based Authentication and Authorization
Introduction You can download the Visual Studio solutions for this article at this location. With al ...
- 关于Unity中坐标系的种类
坐标空间 1:物体空间: 3D物体自己的坐标空间 一般设计时几何体以中心为原点,人物以双脚为原点; 2: 世界空间: 3D物体在场景中的世界坐标, 整个游戏场景的空间; 3: 摄像机空间: 以观察摄像 ...
- 第三百八十一节,Django+Xadmin打造上线标准的在线教育平台—xadmin全局配置
第三百八十一节,Django+Xadmin打造上线标准的在线教育平台—xadmin全局配置 1.xadmin主题设置 要使用xadmin主题,需要在一个app下的adminx.py后台注册文件里,写一 ...
- 利用smba实现windows上写程序,linux上运行
1.在linux下载程序代码(确保获取正确的文件属性) 2.在windows编写代码,对于已有代码,不改变文件权限,如原先为755的,更改文件内容后依然是755的文件,如果要新建文件,默认为644,其 ...
- JSONObject相关依赖架包下载(Maven依赖下载)
一.开发场景Java开发当中经常需要Json格式的数据,这就用到JSONObject类,本文章只提供以下两种JSONObject对应架包的下载方式.1.com.alibaba.fastjson.JSO ...
- 超酷 CSS3/HTML5 3D 飘带菜单实现教程
今天我们来介绍一款很有创意的CSS3/HTML5菜单,首先菜单是飘带形状的,看起来很优雅,这种菜单在个人博客中用的比较多,不仅干净利落,而且很具有个性化.另外,这款菜单在鼠标滑过菜单项时,将会出现3D ...