元旦了,给手残党直接复制的机会,代码如下:

1. :style="{'-webkit-overflow-scrolling': scrollMode}" 最外层div设置,以便兼容;

2. data 设置

3. loadTop 定义下拉刷新函数

4. loadBottom 定义上拉加载函数

5. 查询数据

关键一点根据后台返回的总也页面判断出是否还有下一页(当前页是否大于总页数)

6.更多信息和是否有下一页函数


测试完美运行

现在增加了bottomStatus ,之前统一用的topStatus,感觉不是很好。还是单独区分一下吧。

更新:2019/09/10

完整源码请看本人另一篇博客: https://www.cnblogs.com/panax/p/11806913.html

在vue中运用mt-loadmore 实现上拉加载,下拉刷新的更多相关文章

  1. Vue mint ui用在消息页面上拉加载下拉刷新loadmore 标记

    之前总结过一个页面存在多个下拉加载的处理方式,今天再来说一下在消息页面的上拉加载和下拉刷新,基本上每个app都会有消息页面,会遇到这个需求 需求:每次加载十条数据,上拉加载下拉刷新,并且没有点击查看过 ...

  2. 上拉加载下拉刷新控件WaterRefreshLoadMoreView

    上拉加载下拉刷新控件WaterRefreshLoadMoreView 效果: 源码: // // SRSlimeView // @author SR // Modified by JunHan on ...

  3. RecyclerView 上拉加载下拉刷新

    RecyclerView 上拉加载下拉刷新 <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/teach_s ...

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

    微信小程序实现上拉加载下拉刷新 使用小程序默认提供方法. (1). 在xxx.json 中开启下拉刷新,需要设置backgroundColor,或者是backgroundTextStyle ,因为加载 ...

  5. APICloud上啦加载下拉刷新模块

    apicloud有自带的上啦加载下拉刷新,当让也可以用第三方或者在模块库里面找一个使用 一.下拉刷新,一下代码写在 apiready = function (){} 里面 apiready = fun ...

  6. Flutter上拉加载下拉刷新---flutter_easyrefresh

    前言 Flutter默认不支持上拉加载,下拉刷新也仅仅支持Material的一种样式.Android开发使用过SmartRefreshLayout的小伙伴都知道这是一个强大的刷新UI库,集成了很多出色 ...

  7. 基于better-scroll封装一个上拉加载下拉刷新组件

    1.起因 上拉加载和下拉刷新在移动端项目中是很常见的需求,遂自己便基于better-scroll封装了一个下拉刷新上拉加载组件. 2.过程 better-scroll是目前比较好用的开源滚动库,提供很 ...

  8. SwipeRefreshLayout实现上拉加载下拉刷新

    package com.example.swiperefreshlayoutdemo; import java.util.ArrayList;import java.util.HashMap; imp ...

  9. zepto.js + iscroll.js上拉加载 下拉加载的 移动端 新闻列表页面

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  10. 利用iscroll实现上拉加载下拉刷新

    1.首先引用isScroll插件 说明:页面加载时初始化isScroll,然后调用pullDownAction()和pullUpAction(),每次切换tab时,只需要对pullDownAction ...

随机推荐

  1. Django框架(二十二)—— Django rest_framework-频率组件

    目录 频率组件 一.作用 二.自定义频率类 三.内置的访问频率控制类 四.全局.局部使用 1.全局使用 2.局部使用 3.局部禁用 五.源码分析 1.as_view -----> view -- ...

  2. Django框架(十八)—— CBV源码分析、restful规范、restframework框架

    目录 CBV源码分析.restful规范.restframework框架 一.CBV源码分析 1.url层的使用CBV 2.as_view方法 3.view方法 4.dispatch方法(可以在视图层 ...

  3. Android/IOS APP界面设计之尺寸规范

    1.尺寸以及分辨率 iPhone的界面尺寸不用多说,640*960是基本OK的,也可以是适应5S的640*1136,马上iPhone 6也快来了(随便吐槽一下网上曝的真机谍照,真是丑到离谱...),只 ...

  4. zookeeper的监听

    统一配置管理.统一命名服务.分布式锁.集群管理

  5. 错误ORA-01110,在已删除数据文件情况下如何删除表空间

    如果先行删除了数据文件,再删除表空间,drop tablespace 会出现如下错误: ORA-01116: error in opening database file 89 ORA-01110: ...

  6. multiple-cursors实在是太好用了

    multiple-cursors实在是太好用了 */--> code {color: #FF0000} pre.src {background-color: #002b36; color: #8 ...

  7. 欧拉函数(Euler_Function)

    一.基本概述在数论,对正整数n,欧拉函数varphi(n)是少于或等于n的数中与n互质的数的数目.此函数以其首名研究者欧拉命名,它又称为Euler's totient function.φ函数.欧拉商 ...

  8. 装完某些软件之后IE主页被https://www.hao123.com/?tn=93453552_hao_pg劫持

    今天重装电脑,装完某些软件之后发现IE主页被https://www.hao123.com/?tn=93453552_hao_pg劫持,然后百度各种解决方法都没用,甚至是修改注册表依然没啥用 最后忽然看 ...

  9. TurtleBOT3

    ubuntu更换源 sudo cp /etc/apt/sources.list /etc/apt/sources_backup.list sudo gedit /etc/apt/sources.lis ...

  10. if (user?.Identity?.IsAuthenticated ?? false)这几个问号分别都代表啥意思?

    if (user?.Identity?.IsAuthenticated ?? false)这几个问号分别都代表啥意思? 0 悬赏园豆:5 [已解决问题] 浏览: 229次 解决于 2018-05-16 ...