在vue中运用mt-loadmore 实现上拉加载,下拉刷新
元旦了,给手残党直接复制的机会,代码如下:

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 实现上拉加载,下拉刷新的更多相关文章
- Vue mint ui用在消息页面上拉加载下拉刷新loadmore 标记
		
之前总结过一个页面存在多个下拉加载的处理方式,今天再来说一下在消息页面的上拉加载和下拉刷新,基本上每个app都会有消息页面,会遇到这个需求 需求:每次加载十条数据,上拉加载下拉刷新,并且没有点击查看过 ...
 - 上拉加载下拉刷新控件WaterRefreshLoadMoreView
		
上拉加载下拉刷新控件WaterRefreshLoadMoreView 效果: 源码: // // SRSlimeView // @author SR // Modified by JunHan on ...
 - RecyclerView 上拉加载下拉刷新
		
RecyclerView 上拉加载下拉刷新 <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/teach_s ...
 - 微信小程序上拉加载下拉刷新
		
微信小程序实现上拉加载下拉刷新 使用小程序默认提供方法. (1). 在xxx.json 中开启下拉刷新,需要设置backgroundColor,或者是backgroundTextStyle ,因为加载 ...
 - APICloud上啦加载下拉刷新模块
		
apicloud有自带的上啦加载下拉刷新,当让也可以用第三方或者在模块库里面找一个使用 一.下拉刷新,一下代码写在 apiready = function (){} 里面 apiready = fun ...
 - Flutter上拉加载下拉刷新---flutter_easyrefresh
		
前言 Flutter默认不支持上拉加载,下拉刷新也仅仅支持Material的一种样式.Android开发使用过SmartRefreshLayout的小伙伴都知道这是一个强大的刷新UI库,集成了很多出色 ...
 - 基于better-scroll封装一个上拉加载下拉刷新组件
		
1.起因 上拉加载和下拉刷新在移动端项目中是很常见的需求,遂自己便基于better-scroll封装了一个下拉刷新上拉加载组件. 2.过程 better-scroll是目前比较好用的开源滚动库,提供很 ...
 - SwipeRefreshLayout实现上拉加载下拉刷新
		
package com.example.swiperefreshlayoutdemo; import java.util.ArrayList;import java.util.HashMap; imp ...
 - zepto.js + iscroll.js上拉加载 下拉加载的 移动端 新闻列表页面
		
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...
 - 利用iscroll实现上拉加载下拉刷新
		
1.首先引用isScroll插件 说明:页面加载时初始化isScroll,然后调用pullDownAction()和pullUpAction(),每次切换tab时,只需要对pullDownAction ...
 
随机推荐
- Safari的CSS HACK方法
			
以前的文章里提到过IE6/IE7/IE8/IE9/.Firefox的CSS HACK方法,那么Safari的CSS HACK是什么呢? 请看以下CSS代码: .box { color: black ...
 - php token的生成和使用
			
原文连接:http://ukagaka.github.io/php/2018/05/08/JWT.html 1. 为什么要使用tokent进行登录 前后端分离或者为了支持多个web应用,那么原来的co ...
 - Spring Cloud配置中心内容加密
			
从配置获取的配置默认是明文的,有些像数据源这样的配置需要加密的话,需要对配置中心进行加密处理. 下面使用对称性加密来加密配置,需要配置一个密钥,当然也可以使用RSA非对称性加密,但对称加密比较方便也够 ...
 - 18-vim-插入命令
			
在vi中除了常用的i进入编辑模式外,还提供了以下命令同样可以进入编辑模式: 命令 英文 功能 使用频率 i insert 在当前字符前插入文本 常用 I insert 在行首插入文本 较常用 a ap ...
 - Neo4J空间数据存储
			
1.Neo4j Spatial 简介 1.1Neo4j Spatial概念 Neo4j Spatial项目是图数据库Neo4j的一个插件,它通过将空间数据映射到图模型(graph model),它将对 ...
 - 在MVC4.5.1中使用Ninject
			
看完Pro ASP.NET MVC5的前14章之后,终于开始了自己的项目搭建. 打算在实际项目中使用Ninject 但是总是出现各种问题.这里记录一下 在书中使用的Ninject的版本是: Insta ...
 - shell位置参数变量
 - 停止node进程
			
运行vue-cli项目的时候经常出现端口号占用,npm run dev报错的信息, 此时可通过任务管理器粗暴的杀死node进程,也可以通过cmd检测占用某个端口的程序,进而杀死该进程,步骤如下: 1. ...
 - Ansible的roles标准化与Jenkins持续集成(三)
			
Ansible的roles标准化与Jenkins持续集成(三) 链接:https://pan.baidu.com/s/1A3Iq3gGkGS27L_Gt37_I0g 提取码:ncy2 复制这段内容后打 ...
 - 发布后台接口报错:could not load file or assembly 'mysql.data,' version=6.7.4.0, Culture=neutral, PublicKeyToken=c5687fc88969c44d
			
本地调试正常,但是服务器上面一直报错:could not load file or assembly 'mysql.data,' version=6.7.4.0, Culture=neutral, P ...