使用vue.js开发移动端的活动页面时,有时候会出现因为请求的数据没有返回而使得当前活动页结构混乱或者不美观,这个时候可以考虑使用pace.js,通过设置参数值,在ajax全部请求结束之前显示loading图或其他样式,用户体验会上升很多。

  那么如何设置才能等监听完所有的ajax请求结束之后才显示渲染好的页面呢?具体请参考pace.js  http://github.hubspot.com/pace/docs/welcome/

  window.paceOptions = {
     ajax: true,
     eventLag: false,
     elements: false
  }  

  这里只说下踩过的坑:在window.paceOption{ } 里设置ajax为true之后,通过charles里的小乌龟调成较慢网速,会发现使用pace.js配置的loading图或文字等样式并没有等数据全部请求完成之后消失,这样并没有达到我们想要的效果,通过查阅资料,会发现是pace.js在一些版本里默认ajax只跟踪GET方法的问题,需要在pace.js引入前添加代码:

  window.paceOptions = {
    ajax: {
      trackMethods: ['GET', 'POST']
    }
  }

或者把post请求改成get.

使用pace监控ajax踩过的坑的更多相关文章

  1. 第八篇:web之前端踩的一些坑

    前端踩的一些坑   前端踩的一些坑 本节内容 事件代理 清除标签的所有事件 bootstrap的模态框自定义方法 ajax在django里面实现post提交 ajax提交数据嵌套 1.事件代理 之前写 ...

  2. wrk 使用记录及踩过的坑

    wrk是什么?https://github.com/wg/wrk wrk 是一个非常小巧高效的开源性能测试工具,支持lua脚本来创建复杂的测试场景.wrk 的一个很好的特性就是能用很少的线程压出很大的 ...

  3. Dcloud开发webApp踩过的坑

    Dcloud开发webApp踩过的坑 一.总结 一句话总结:HTML5+扩展了JavaScript对象plus,使得js可以调用各种浏览器无法实现或实现不佳的系统能力,设备能力如摄像头.陀螺仪.文件系 ...

  4. framework7 总结之前遇到的问题和踩过的坑

    官网上写的案例比较简单明了,我这里就将我使用时踩过的坑做一个总结,与大家共勉! 最近使用framework,基本全靠浏览官方文档,当然,有遇到了许多的错误,开始不知道哪里出问题也很着急,到最后发现问题 ...

  5. apicloud地图、即时通讯、人脸识别登录、以及平时踩过得坑

    apicloud技术浅谈 导语 apicloud 的学习也有一段时间了,这是我个人的一些经验,和踩过的坑,希望对大家能有一些帮助. apicloud的知识准备 apicloud 是一个用原生的思想搭建 ...

  6. 要想不踩SaaS那些坑,得先了解“SaaS架构”

    摘要:围绕当下许多企业青睐的SaaS应用开发,华为云开发者技术服务工程师程泽在DTT首期带来主题为 <SaaS云原生应用典型架构> 的DTT首期直播分享. 本文分享自华为云社区<DT ...

  7. 项目中踩过的坑之-sessionStorage

    总想写点什么,却不知道从何写起,那就从项目中踩过的坑开始吧,希望能给可能碰到相同问题的小伙伴一点帮助. 项目情景: 有一个id,要求通过当前网页打开一个新页面(不是当前页面),并把id传给打开的新页面 ...

  8. web开发实战--弹出式富文本编辑器的实现思路和踩过的坑

    前言: 和弟弟合作, 一起整了个智慧屋的小web站点, 里面包含了很多经典的智力和推理题. 其实该站点从技术层面来分析的话, 也算一个信息发布站点. 因此在该网站的后台运营中, 富文本的编辑器显得尤为 ...

  9. "开发路上踩过的坑要一个个填起来————持续更新······(7月30日)"

    欢迎转载,请注明出处! https://gii16.github.io/learnmore/2016/07/29/problem.html 踩过的坑及解决方案记录在此篇博文中! 个人理解,如有偏颇,欢 ...

随机推荐

  1. 【Ctsc2011】幸福路径

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=2306 给定一张有向图,每个点有权值,蚂蚁从某个节点出发,初始体力值为$1$,每走一条边$体 ...

  2. Redis<六> Key通用操作

    1). KEYS pattern : 查找所有符合给定模式 pattern 的 key . 如 keys * , keys *list* 2). DEL key [key ...] : 删除给定的一个 ...

  3. 距离为K的节点 All Nodes Distance K in Binary Tree

    2018-07-26 17:38:37 问题描述: 问题求解: 解法一. 第一种解法是使用Graph + BFS.换言之,就是将二叉树转化为无向图,然后在无向图中使用BFS进行层次遍历即可. 这种解法 ...

  4. Win10安装Mysql5.7数据库

    Win10安装Mysql5.7数据库 最近做个demo在自己本地装了一个mysql5.7,有些小麻烦记录一下. 安装环境:系统是 windows 10 1.官网下载 下载地址:https://dev. ...

  5. 对微服务API服务网关的理解

    目录微服务专栏地址目录1. 简介2. 什么是API网关3. 为什么需要API网关4. API网关在微服务架构体系中处于什么位置4.1 调用者眼中的API网关4.2 所处的位置5. 网关技术实现有哪些6 ...

  6. 3-22 Ruby 编码规则(个人整理)

    编码规则 https://github.com/thoughtbot/guides/tree/master/style/ruby *Use a trailing comma after each it ...

  7. android--------自定义视频控件(视频全屏竖屏自动切换)

    android播放视频也是常用的技术,今天分享一个自定义视频控件,支持自定义控制 UI,全屏播放, 可以实现自动横竖屏切换的控件,跟随手机的位置而,重力感应自动切换横竖屏. 效果图:   代码下载Gi ...

  8. 『PyTorch』第十四弹_torch.nn.Module类属性

    nn.Module基类的构造函数: def __init__(self): self._parameters = OrderedDict() self._modules = OrderedDict() ...

  9. bzoj2763: [JLOI2011]飞行路线 最短路

    题意:求最多可以有k条路免费的最短路 题解:用dis[x][k]表示从s开始用了k次免费机会到x的最短路,然后dij跑的时候优先队列里多维护一个k就好了 /********************** ...

  10. POJ-1180 Batch Scheduling (分组求最优值+斜率优化)

    题目大意:有n个任务,已知做每件任务所需的时间,并且每件任务都对应一个系数fi.现在,要将这n个任务分成若干个连续的组,每分成一个组的代价是完成这组任务所需的总时间加上一个常数S后再乘以这个区间的系数 ...