最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛。个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较晦涩的。(个人看法)

微信端展示公司订单,采用了滚动加载而没有用分页,觉得一般移动端分页的处理比较少。当然,条件搜索才是满足用户精准查找的核心,无论是分页还是滚动加载都只是给用户一个大致浏览的处理。

顺便说说注意的一点,jquery-weui这个文件引入的位置应该在jq文件之后,这样才能在Jq的基础上识别出封装的一系列JS操作的函数。

如果是有以上报错,说明你可能没有引入jquery-weui文件,或者文件位置放错了,导致识别不了滚动加载初始化的函数。

当写到某个页面的时候,按照以往套路,滚动事件竟然一直触发不了。

一段段代码注释才发现,是select标签搞的鬼。

dataList是vue中data,vm.dataList = STATUS_LIST;

select中的option是v-for循环生成的,但是我的v-for对象是vue实例中的data中的一个数组,只是把全局对象的status_list转了一下给了vue的data而已。如果是直接v-for 全局中的这个个变量status_list的话,那么就能够触发滚动加载事件。

总结:直接调用全局对象来v-for循环就好,没必要转一手给vue.data

思考:想了很久,网上也没找到类似的问题,个人觉得是vue生命周期和jq操作dom时间点的差异导致无法计算出scrollTop,致使无法触发滚动条滚动到底部触发滚动加载事件。具体细节原来也不是很明白。

在此记录一下这个bug,希望路过的大神能一起交流探讨。

记录WEUI中滚动加载的一个BUG的更多相关文章

  1. 记录JQ-WEUI中滚动加载的一个BUG

    最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛.个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较 ...

  2. weui实现滚动加载的效果

    weui是微信公司提供的一个UI框架,在H5开发中一些组件可以直接使用.weui文档地址:http://www.jqweui.cn/components 使用weui,需要引入weui.css和jqu ...

  3. jquery weui ajax滚动加载更多

    手机端使用jquery weui制作ajax滚动加载更多. 演示地址:http://wx.cnkfk.com/nuol/static/fpage.html 代码: <!DOCTYPE html& ...

  4. 移动设备的HTML页面中图片实现滚动加载

    如今移动互联网风靡全球,移动页面的元素也是丰富多彩,一个移动页面的图片超过10张已经是再正常不过的事情了.但是相对,很多移动用户还停留在2G,3G这样的网络中.那么这样带宽的用户,在浏览这样的页面时, ...

  5. jQuery WeUI 组件下拉刷新和滚动加载的实现

    最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...

  6. MVC中在一个视图中,怎么加载另外一个视图?

    在RazorView.cshtml视图: <!--在视图中调用无返回值的方法,视图中调用无返回值的方法,要加上大括号--> <!--在一个视图中,直接加载另外一个视图--> @ ...

  7. android开发之Fragment加载到一个Activity中

    Fragments 是android3.0以后添加的.主要是为了方便android平板端的开发.方便适应不同大小的屏幕.此代码是为了最简单的Fragment的使用,往一个Activity中添加Frag ...

  8. Angular中懒加载一个模块并动态创建显示该模块下声明的组件

    angular中支持可以通过路由来懒加载某些页面模块已达到减少首屏尺寸, 提高首屏加载速度的目的. 但是这种通过路由的方式有时候是无法满足需求的. 比如, 点击一个按钮后显示一行工具栏, 这个工具栏组 ...

  9. js 滚动加载iframe框中内容

    var isIE6 = !!window.ActiveXObject&&!window.XMLHttpRequest; //滚动加载 var scrollLoad =function( ...

随机推荐

  1. Asp.Net Web API(六)

    Asp.Net Web API不可以需要IIS.可以自己在主机上承载一个Web API 创建WebAPI.Server项目 创建一个控制器项目的服务端 在Nuget中添加Microsoft.AspNe ...

  2. 《软件测试的艺术(原书第2版)》【PDF】下载

    <软件测试的艺术(原书第2版)>[PDF]下载链接: https://u253469.ctfile.com/fs/253469-231196343 内容简介 本书以一次自评价测试开篇,从软 ...

  3. 为什么在有的服务器上禅道、蝉知安装会报错? 之理解MySQL的SQL_MODE

    最近用蝉知的CMS 建站比较多,感觉蛮顺手的,但在给客户安装的时候却会出现安装报错,其原因也很简单 查看了一下他们的install.sql文件中,有些时间字段的默认值是0000-00-00 00:00 ...

  4. 破解iframe微信推文(图片)防盗链

    $.ajaxPrefilter(function(options) { if(options.crossDomain && jQuery.support.cors) { var htt ...

  5. iOS 页面之间的专长动画控制器间的转换

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; line-height: 24.0px; font: 14.0px "Heiti SC Light" ...

  6. java 学习笔记之 流、文件的操作

    ava 学习笔记之 流.文件的操作 对于一些基础的知识,这里不再过多的解释, 简单的文件查询过滤操作 package com.wfu.ch08; import java.io.File; import ...

  7. js获取图片的EXIF,解决图片旋转问题

    相信大家在做项目的时候会遇到在canvas里加入图片时,图片发生90°,180°的旋转.当时的你肯定时懵逼的,为毛. 其实这就是图片的EXIF搞的鬼. 什么是EXIF 简单来说,Exif 信息就是由数 ...

  8. MySQL Group Replication 动态添加成员节点

    前提: MySQL GR 3节点(node1.node2.node3)部署成功,模式定为多主模式,单主模式也是一样的处理. 在线修改已有GR节点配置 分别登陆node1.node2.node3,执行以 ...

  9. BZOJ4970 IOI2004 empodia障碍段

    4970: [ioi2004]empodia 障碍段 Time Limit: 10 Sec  Memory Limit: 128 MB Description 古数学及哲学家毕氏相信自然之本质为数学. ...

  10. 51nod 1203 jzplcm

    长度为N的正整数序列S,有Q次询问,每次询问一段区间内所有数的lcm(即最小公倍数).由于答案可能很大,输出答案Mod 10^9 + 7.   例如:2 3 4 5,询问[1,3]区间的最小公倍数为2 ...