最好按照github里的例子ctrl+c => v 模版、js

mint-ui/example/pages/pull-up.vue

注意设置:mt-loadmore组件:auto-fill='autoFill'为false,以防止上来无限请求
    :给mt-loadmore父组件css:overflow: scroll;防止华为手机和苹果模式下浏览器手机测试上拉无效
    :给mt-loadmore父组件css:-webkit-overflow-scrolling: touch;防止苹果手机拖动生涩
    :给mt-loadmore父组件高度:style="{ height: wrapperHeight + 'px' }

 mounted() {
  this.wrapperHeight = document.documentElement.clientHeight - this.$refs.wrapper.getBoundingClientRect().top;
}

上边这个是官方方法,用来去除轻微上拉就触发检测机制从而加载下一页的BUG

    :不要忘记判断加载完成全部后台传来的数据列表后,this.allLoaded = true;知会禁止上拉加载

相关理解:loadBottom()是上拉加载的方法,当用户上拉超过阀值,触发加载就是调用这个方法。请进行相关请求操作,请求完成后调用this.$refs.loadmore.onBottomLoaded()方法通知loadmore组件加载完成,进而自动更新status

 handleBottomChange(status) {
  this.bottomStatus = status;
}

这个官方方法照搬就行了,用来绑定loadmore状态到vue实例的,通过这个值来更新显示给用户看的状态

mint-ui loadmore使用方法和注意事项的更多相关文章

  1. 基于VUE.JS的移动端框架Mint UI

    Mint UI GitHub:github.com/ElemeFE/mint 项目主页:mint-ui.github.io/# Demo:elemefe.github.io/mint- 文档:mint ...

  2. vue mint ui 手册文档对于墙的恐惧

    http://www.cnblogs.com/smallteeth/p/6901610.html npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm ...

  3. vue mint ui 手册文档

    npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i mint-ui -S CDN 目前可以通过 unpkg.com/mint-ui 获取到最新版本 ...

  4. Vue移动组件库Mint UI的安装与使用

    一.什么是 Mint UI 1.Mint UI 包含丰富的 CSS 和 JS 组件,可以提升移动端开发效率 2.Mint UI 按需加载组件 3.Mint UI 轻量化 二.Mint UI 的安装 1 ...

  5. Linux任务调度进程crontab的使用方法和注意事项

    参考文章:Linux任务调度进程crond命令的使用方法和注意事项 一.crond简介 概念 crond的概念和crontab是不可分割的.crontab是一个命令,常见于Unix和类Unix的操作系 ...

  6. Swift基础--Swift中的分类以及在分类中扩展init方法的注意事项

    Swift中的分类 1.创建一个空的swift文件 2.关键字extension,格式: extension 要扩展的类名 {} extension UIButton { } Swift中扩展init ...

  7. vue mint UI

    vue 与mint  UI 结合开发手机app  html5页面 api  文档   http://mint-ui.github.io/#!/zh-cn

  8. C++ 开发OCX 的方法和注意事项

    C++ 开发OCX 的方法和注意事项 前言 ActiveX控件是一种实现了一系列特定接口而使其在使用和外观上更象一个控件的COM组件.ActiveX控件这种技术涉及到了几乎所有的COM和OLE的技术精 ...

  9. java字符流操作flush()方法及其注意事项

    java字符流操作flush()方法及其注意事项   flush()方法介绍 查阅文档可以发现,IO流中每一个类都实现了Closeable接口,它们进行资源操作之后都需要执行close()方法将流关闭 ...

随机推荐

  1. 电脑小白和ta的小白电脑——JAVA开发环境

    JAVA开发环境的搭建有一点点复杂,不过一步一步来一般不会出错. (一)下载JDK 首先我们需要下载java开发工具包JDK,可以通过官网下载:http://www.oracle.com/techne ...

  2. 根据关键字获取高德地图poi信息

    根据关键字获取高德地图poi信息 百度地图和高德地图都提供了根据关键字获取相应的poi信息的api,不过它们提供给普通开发者使用的次数有限无法满足要求.其次百度地图返回的poi中位置信息不是经纬度,而 ...

  3. EFCore Lazy Loading + Inheritance = 干净的数据表 (一) 【献给处女座的DB First程序猿】

    前言 α角 与 β角 关于α角 与 β角的介绍,请见上文 如何用EFCore Lazy Loading实现Entity Split. 本篇会继续有关于β角的彩蛋在等着大家去发掘./斜眼笑 其他 本篇的 ...

  4. java IO性能对比----read文件

    本次对比内容为:(jdk1.8) fileInputStream:最基本的文件读取(带自己声明的缓冲区) dataInputStream:字节读取,在<java编程思想>一书中描述为使用最 ...

  5. java基础知识—类的方法

    1.定义类方法的语法: 访问修饰符 返回值类型 方法名(){ 方法体: } 2.方法名的规范: 1.必须以字母下划线·“—”或“$”开头 2.可以有数字,但不能以数字开头. 3.如果方法名是以多个单词 ...

  6. vue-resource 和 axios的区别

    vue-resource Vue.js是数据驱动的,这使得我们并不需要直接操作DOM,如果我们不需要使用jQuery的DOM选择器,就没有必要引入jQuery.vue-resource是Vue.js的 ...

  7. Oracle数据库各种名字的区别

    数据库名(DB_NAME).数据库实例名(INSTANCE_NAME).操作系统环境变量(ORACLE_SID).数据库服务名(SERVICE_NAME).数据库域名(DB_DOMAIN)以及全局数据 ...

  8. placeholder是H5的一个新属性,但是在IE9以下是不支持的

    $(function() { // 如果不支持placeholder,用jQuery来完成 if(!isSupportPlaceholder()) { // 遍历所有input对象, 除了密码框 $( ...

  9. 字符串与NUll的拼接问题

    今天做项目,浏览器向后台传值的时候,碰到一个问题,声明变量的时候为null时,首次加载会报错.但是初始化一次后,就正常传值了,摸索了半天,终于找到问题所在.在此记录一下,谨记. 现在说说情况,我在JS ...

  10. 从零开始写自己的PHP框架系列教程(二)[App.php]

    从这一个文件开始以后加载的均以类加载,请注意命名空间和所在文件的路径 APP.php的这个类所在路径:根目录\framework\App.php 直接上代码 namespace framework; ...