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)上拉刷新、下拉加载更多的更多相关文章

  1. juery下拉刷新,div加载更多元素并添加点击事件(二)

    buffer.append("<div class='col-xs-3 "+companyId+"' style='padding-left: 10px; padd ...

  2. Android 自定义 ListView 上下拉动“刷新最新”和“加载更多”歌曲列表

    本文内容 环境 测试数据 项目结构 演示 参考资料 本文演示,上拉刷新最新的歌曲列表,和下拉加载更多的歌曲列表.所谓"刷新最新"和"加载更多"是指日期.演示代码 ...

  3. jQuery模拟原生态App上拉刷新下拉加载

    jQuery模拟原生态App上拉刷新下拉加载效果代码,鼠标上拉时会显示loading字样,并且会模拟加载一条静态数据,支持触屏设备使用. <!doctype html> <html ...

  4. Android之 RecyclerView,CardView 详解和相对应的上拉刷新下拉加载

    随着 Google 推出了全新的设计语言 Material Design,还迎来了新的 Android 支持库 v7,其中就包含了 Material Design 设计语言中关于 Card 卡片概念的 ...

  5. Flutter学习笔记(25)--ListView实现上拉刷新下拉加载

    如需转载,请注明出处:Flutter学习笔记(25)--ListView实现上拉刷新下拉加载 前面我们有写过ListView的使用:Flutter学习笔记(12)--列表组件,当列表的数据非常多时,需 ...

  6. 微信小程序 上拉刷新/下拉加载

    小程序项目中上拉刷新下拉加载是比较常见的需求,官方文档也提供了相当友好的API,但是因为API隐藏的比较深,文档描述也比较模糊所以也折腾了一番(官方文档),在此记录一下使用方式 onPullDownR ...

  7. ListView上拉刷新和分页加载完整的Dome

    很多人工作的过程中都会碰到ListView下拉刷新和分页加载,然后大多数公司都已经把框架写好了,大家直接用就可以了,有些人一直对这个事情处于迷茫状态,为了让大家对上拉刷新和分页加载有一个比较全面的认识 ...

  8. jQuery WeUI 组件下拉刷新和滚动加载的实现

    最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...

  9. 实现app上对csdn的文章列表上拉刷新下拉加载以及加入缓存文章列表的功能 (制作csdn app 四)

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/23698511 今天继续对我们的csdn客户端未完成的功能进行实现,本篇博客接着客 ...

  10. 第三方 XListview 上拉加载、下拉刷新、分页加载和Gson解析

    注意:此Demo用的是第三方的Xlistview.jar,需要复制me文件夹到项目中,两个XML布局文件和一张图片 把下面的复制到String中 <string name="xlist ...

随机推荐

  1. jQuery imgAreaSelect Examples

    案例:前端图片截取功能 分布说明A:选择File本地选择的图片 B:根据需求按比例缩放图片 C:区域选择型操作 A: 选择图片 <input class="upfile" t ...

  2. ACTIVE NEURAL LOCALIZATION

    用贝叶斯滤波器定义状态,用rl帮助定位. 这个方法需要对地图和角度进行离散化,当地图很大,角度较精细时,输出会很大,所以不太可能用到大地图,高精度角度的任务上.

  3. ERROR:tornado上传文件过大超出范围报错

    该怎么解决呢? HTTPServer里面指定max_buffer_size就可以了 EXAMPLE # server = HTTPServer(application, max_buffer_size ...

  4. C语言简明数据类型指南

    一.常用的数据类型 char:字符在计算机的存储器中以字符编码的形式保存,字符编码是一个数字,因此在计算机看来,A与数字65完全一样(65是A的ASCII码). int:如果要保存一个整数,通常可以使 ...

  5. (原)linux下利用cmake来编译jthread开源库

    其实上次在用hisi3531平台的时候,就已经编译过一次这个库了,这次换了平台环境,交叉编译器变成了arm-hisiv100-linux-工具链,所以,没办法只能重新来过. 因为之前编译过,所以这次还 ...

  6. memcache -- 使用场景

    memcache:分布式缓存机制 使用场景: 1.对数据的存储要求不高,就算丢失也关系不大(因为memcache是非持久化存储) 2.不适合单机使用,即不适合将memcache和数据库等都放到同一台机 ...

  7. javapms部署之后首页不能正常显示问题

    今天在ligerui的技术群里看见了javapms,于是就到官网逛了逛 首先要做的就是了解了javapms使用到的技术 然后下载了程序安装包javapms_v1.1_beta(官网下载失败了,就bai ...

  8. C# byte[]保存成文件

    string path = Server.MapPath(@"\a.pdf"); FileStream fs = new FileStream(path, FileMode.Cre ...

  9. memcached注意事项与应用范围、应用条件、限制

    一.服务器内存为4GB,却仅分配量3GB,因为内存分配量超过这个值,可能导致内存交换(swap). memcached启动时 指定的内存分配量是memcached用于保存数据的内存大小,没有包括&qu ...

  10. LAMP架构介绍MySQL、MariaDB介绍 MySQL安装