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. 十二、curator recipes之双重屏障DoubleBarrier

    简介 curator实现了单个屏障barrier和双重屏障DoubleBarrier,单个屏障就是在一个进程里面设置了屏障,并等待其它进程去移除这个屏障,否则一直阻塞.双重屏障就是设置了两道屏障,两个 ...

  2. LeetCode 第二天后续(两数相加 python3)

    # Definition for singly-linked list. # class ListNode: # def __init__(self, x): # self.val = x # sel ...

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

    一. 尽可能详细的描述出一个应用软件, 比如QQ, 在计算机中运行时涉及的软硬件, 以及说明我们编程的侧重点? 电脑开机, 从硬盘中(外部存储设备)加载操作系统(系统软件)到内存(内部存储设备), 并 ...

  4. Q:接口与抽象类

    博文回答一下两个问题: 接口和抽象类的区别 选用接口和抽象类的依据 对于问题1: 从java语法的角度上来说,接口的所有成员和方法都是public的,且其方法均为abstract的.直到jdk1.8之 ...

  5. 20条最最常用的Linux命令讲解

    玩过Linux的人都会知道,Linux中的命令的确是非常多,但是玩过Linux的人也从来不会因为Linux的命令如此之多而烦恼,因为我们只需要掌握我们最常用的命令就可以了.当然你也可以在使用时去找一下 ...

  6. Visual Studio 与 Visual C++ 关系

      Visual Studio .net Visual C++ .net Visual C++ _MSC_VER 备注 Visual Studio .net 2002 Visual C++ .net ...

  7. weixin设置菜单

    https://jingyan.baidu.com/article/925f8cb8dfcf11c0dce05661.html

  8. c# 控制台定时程序

    using System; using System.Timers; namespace DaoChuCore2 { class Program { static void Main(string[] ...

  9. PHPStorm/webstorm/PyCharm tips

    phpstorm对于使用PHP开发web的人员来说,是一个非常不错的编辑开发IDE,以前用过sublime,但是相比于storm,sublime在浏览legacy代码,类代码编辑方面明显要逊色不少.同 ...

  10. [翻译] CHAnimation

    CHAnimation https://github.com/cyndibaby905/CHAnimation How it looks CHAnimation is a project used t ...