vue-scroll放在vue的项目中,实现下拉刷新的效果,但是发现,不能上拉的bug,上拉了之后,底部出现了一大段的空白,参照GitHub的问题,算是暂时解决了。

不能上拉的原因是:滑动标签里边的内容(内容区域)为绝对定位,改为相对定位就可以了。这样高度的百分之百才是全局的百分之百。

contentHeight应该去除pull-to-refresh-layer高度,否则某些情况下会导致底部多出一部分空白。暂时用flot:left解决。代码如下:

._v-container > ._v-content > .pull-to-refresh-layer {
width:100%;
height:120px;
margin-top:-120px;
text-align:center;
font-size:32px;
color:#AAA;
float:left;
top:0;
left:0;
}

  

vue-scroll 底部无数据时,底部出现大片的空白的更多相关文章

  1. 【vue】渲染大量数据时性能优化

    对应vue渲染大量数据时可以考虑下面几点: 1. 异步渲染组件:因为组件渲染太多,影响页面的渲染时间,所有可以延迟组件渲染,可以考虑v-if处理 2. 可以使用虚拟滚动的组件:参考使用这个插件 vue ...

  2. 当vue 页面加载数据时显示 加载loading

    参考:https://www.jianshu.com/p/104bbb01b222 Vue 页面加载数据之前增加 `loading` 动画 创建组件 1.新建 .vue 文件: src -> c ...

  3. easyui 中Datagrid 控件在列较多且无数据时,列显示不全的解决方案

    在onLoadSuccess 中加入如下代码就OK啦 $('#dg3').datagrid({ onLoadSuccess:function(data){ if(data.total==0){ var ...

  4. 扩展当easyui datagrid无数据时,显示特定值。如:没有数据

    var myview = $.extend({},$.fn.datagrid.defaults.view,{ onAfterRender:function(target){ $.fn.datagrid ...

  5. GridView 无数据时,绑定提示

    private void BindData() { DataTable dt = DAO.RunSQLReturnDt(this.getsql()); int dtcount = dt.Rows.Co ...

  6. 为什么你需要在用 Vue 渲染列表数据时指定 key

    本文改写整理自一篇博文,原文链接如下: Why you should use the key directive in Vue.js with v-for Application state and ...

  7. easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题

    在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...

  8. winform DataGridView控件判断滚动条是否滚动到当前已加载的数据行底部 z

    http://www.zuowenjun.cn/post/2015/05/20/162.html 判断 DataGridView控件滚动条是否滚动到当前已加载的数据行底部,其实方法很简单,就是为Dat ...

  9. 实现winform DataGridView控件判断滚动条是否滚动到当前已加载的数据行底部

    判断 DataGridView控件滚动条是否滚动到当前已加载的数据行底部,其实方法很简单,就是为DataGridView控件添加Scroll事件,然后写入以下代码就可以了,应用范围:可实现分部加载数据 ...

随机推荐

  1. 撩课-Python-每天5道面试题-第5天

    一. 给定一个圆心和半径, 以及一个点坐标, 判定该点是否在圆内; 例如: 用户输入圆心: (1, 2) 半径: 2.5 测试点为(2, 2)结果: 判定测试点是在圆内 思路: 结合勾股定理, 计算测 ...

  2. Java根据国家二字码获取国家英文名称,中文名称实例

    import org.apache.commons.lang.StringUtils; public class CountryUtil { /** * 根据国家二字码获取国家对应的中文(英文,cod ...

  3. golang rpc 简单范例

    RPC(Remote Procedure Call Protocol)--远程过程调用协议,它是一种通过网络从远程计算机程序上请求服务,而不需要了解底层网络技术的协议. 它的工作流程如下图:   go ...

  4. Spring Boot 概述

    spring boot 的功能: 1.自动配置 2.起步依赖 3.Actuator hello word: http://start.spring.io 中按需生产spring boot项目,然后倒入 ...

  5. Ubuntu16.04(Linux)安装JDK

    Ubuntu 安装JDK的两种方式: 1:通过ppa(源) 方式安装. 2:通过官网下载安装包安装. 第1种,因为可以通过 apt-get upgrade 方式方便获得jdk的升级 第一种:使用ppa ...

  6. 汇编语言程序环境搭建masm+debug64位 win10/7

    介绍:MASM是Microsoft Macro Assembler 的缩写,是微软公司为x86 微处理器家族开发的汇编开发环境,拥有可视化的开发界面,使开发人员不必再使用DOS环境进行汇编的开发,编译 ...

  7. vuex入门教程和思考 [转] 里面有几个实例

    Vuex基础概念 vuex中涉及的概念主要有下面几点,下面做个简单的介绍和理解. Vuex 官方文档:https://vuex.vuejs.org/zh-cn/ 官网有介绍,也有个demo shopp ...

  8. android头像上传(获取头像加剪切)

    因为项目中需要用到头像上传的功能,所以就下个Ddmo先来实现下. demo我是类似仿微信的,在一个GridView中展示所有的图片,其中第一个item可以去照相:获取到图片后再进行剪切. 图片的剪切是 ...

  9. Word操作总结

    1.竖向选择 Notepad中:先把鼠标光标放在起始位置,然后同时按 Alt+Ctrl 或Alt+shift键,然后移动鼠标选取内容. Word中只能用Alt+Shift .

  10. FTP上传和WEB上传的区别

       说区别之前,咱先说说什么是上传?上传就是将信息从个人计算机(本地计算机)传递到中央计算机(远程计算机)系统上,让网络上的人都能看到.将制作好的网页.文字.图片等发布到互联网上去,以便让其他人浏览 ...