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="pageNum = 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.pageNum === 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. 学习总结&实验报告1

    Java实验报告 1.打印输出所有的“水仙花数”,所谓“水仙花数”是指一个3位数,其中各位数字立方和等于该数本身.例如,153是一个“水仙花数”. 实验代码: public class Project ...

  2. Python中classmethod和staticmethod的区别

    学习python中经常会出现一些相近或者相似的语法模块等,需要对比分析才能加深记忆,熟练运用. staticmethod:静态方法 classmethod:类方法 在python中,静态方法和类方法都 ...

  3. nginx下载安装和虚拟机的配置

    一. Nginx下载安装 1.Nginx下载:nginx-1.13.0.tar.gz,下载到:/usr/local/software/ wget http://nginx.org/download/n ...

  4. Python设置

    1.中断程序执行 在命令行中中断正在执行的程序,ctrl c或者ctrl break 2.SyntaxError: Non-ASCII character 需要在最开始的地方加上 : #-*-codi ...

  5. P3588 [POI2015]PUS(拓扑排序+线段树)

    P3588 [POI2015]PUS 对于每个$(l,r,k)$,将$k$个位置向剩下$r-l-k+1$个位置连边,边权为$1$,这样就保证$k$个位置比剩下的大 先给所有位置填$1e9$保证最优 然 ...

  6. MFC- socket 编程

    一.CAsyncSocket类 CAsyncSocket属于异步非阻塞类. CAsyncSocket类采用了windows socket中的WSAAsyncSelect模型.CAsyncSocket ...

  7. 自动化部署三剑客 gitlab + ansible + jenkins

    http://www.showerlee.com/archives/1880 https://edu.51cto.com/center/course/lesson/index?id=280700 Gi ...

  8. maven项目pom.xml报错: Failure to transfer org.apache.maven.plugins:maven-surefire-plugin:pom:2.7.1 from

    转自:https://blog.csdn.net/wolf1213hao/article/details/53413093

  9. 4--面试总结-promise

    promise异步原理: 定义:promise是异步编程的解决方案,可以解决异步回调地狱的问题: 原理:三种状态两种结果的一个状态机:三种状态(pending,fulfilled,rejected)两 ...

  10. layui 动态添加 表格数据

    静态表格: <table class="layui-table" id="table" lay-filter="table"> ...