pullrefresh_with_tab.html真是数据交互,并解决demo中第一次上拉加载无效

为了做一个这样的效果出来真的是呕心沥血,一个坑有一个坑,说多了都是泪,分享给大家,长长经验吧。。。。

首先页面框架还是一样的,导入mui.min.css,mui.min.js,mui.pullToRefresh.js,mui.pullToRefresh.material.js,主体结构还是一样的,下面就是交互问题了。

pullrefresh_with_tab.html这个demo的原理就是先将所有页面的数据拼接出来,所以第一次就必须要拿到所有数据,然后根据标题进行拼接,这边有三个标题,请注意title值,这是你要发送请求传的值

下面就有三个ul来装列表,然后发送请求将内容放在各自标题下面

这就拿到了每个标题下面的数据,后面就涉及到一个翻页的问题,我这边是做了一个另外的请求,重新写了一个方法,因为之前的方法拿到的是全部的数据,这个方法就是请求单个标题的数据,

翻页写好之后是通过上拉加载来调用的,

通过上拉加载来翻页,但是我自己做的时候出了一个很烦人的问题,就是我第一次上拉加载之后再上拉就失效了,非要第二次才有用,找好久才发现原来只要把setTimeout删掉就可以了,这里有一个延迟的效果

这边是我个人碰到的问题,跟大家分享一下,可能不够详细,不明白的地方或者有问题的地方欢迎大家评论,私聊。。。

时间: 2024-10-26 11:52:38

pullrefresh_with_tab.html真是数据交互,并解决demo中第一次上拉加载无效的相关文章

Mint-ui中loadmore(上拉加载下拉刷新)组件在ios中滑动会触发点击事件的解决方法

bug说明: Mint-ui中loadmore(上拉加载下拉刷新)组件 在 使用fastclick的情况下 ,在ios设备中滑动会触发点击事件: 解决方法: 我是按需引入,去项目中找到loadmore下的index.js,全部引入的要找mint下面mint-ui.common.js 路径如下:你的项目名/node_modules\mint-ui\lib\loadmore\index.js 搜索 handleTouchEnd ,记得写event进去 handleTouchEnd: function

ListView的下拉刷新+上拉加载(已有demo)

1.XListView因为添加了Header,会导致存储的数据+1,所以赋值时需要position-1.补充:当去掉HeaderView时,position不用-1. 2.提个建议:上拉加载更多,最好在onCreate()中就执行setAdapter,然后不论是空数据.还是有数据,只用更新适配器就行了. 一.XListView 2.用法 导入图中的me.maxwin.view包 提供了两个接口: IXListViewListener:触发下拉刷新,上拉加载更多.实现此接口时,onLoadMore

读取网上gson数据,展示到gridview上,然后上拉加载,下拉刷新

NetWorkUtil.class package com.example.liangminghui20160425; import java.io.IOException; import org.apache.http.HttpEntity; import org.apache.http.HttpResponse; import org.apache.http.client.ClientProtocolException; import org.apache.http.client.HttpC

你必须了解的RecyclerView的五大开源项目-解决上拉加载、下拉刷新和添加Header、Footer等问题

前段时间做项目由于采用的MD设计,所以必须要使用RecyclerView全面代替ListView.但是开发中遇到了需要实现RecyclerView上拉加载.下拉刷新和添加Header以及Footer等需求问题,现将问题解决中用到的五大开源项目总结下来,方便他人. 首先介绍下RecyclerView,RecyclerView相比ListView增加了很多新特性: ? Adapter中的ViewHolder模式 - 对于ListView来说,通过创建ViewHolder来提升性能并不是必须的.因为L

android 下拉刷新上拉加载更多,高仿ios左滑动删除item,解决了众多手势问题

一.前言 老规矩,别的不说,这demo是找了很相关知识集合而成的,可以说对我这种小白来说是绞尽脑汁!程序员讲的是无图无真相!现在大家一睹为快! 二.比较关键的还是scroller这个类的 package com.icq.slideview.view; import android.content.Context; import android.util.AttributeSet; import android.util.Log; import android.util.TypedValue; i

ionic上拉加载更多当数据加载完没有下一页的时候我们需要显示一下"没有更多了"的友好提示

ionic上拉加载更多当数据加载完没有下一页的时候我们需要显示一下"没有更多了"的友好提示,但是在ionic里面遇到了一个问题.就是没有数据的时候我显示了没有更多的时候我的点击商品详情的事件失效了.怎么点都不触发 这到底怎么回事.简直是....遇到了各种奇葩问题.好了先不吐槽了.还是先解决问题吧. 我们看代码的时候很容易从因为这句话而出发.最开始的时候我是上拉第一页的时候.点击事件还有效.也就是上拉到最后一页点击事件才会失效.也就是isNext为false的时候.这时候我就会以为是ng

android最基本的lsitvew实现下拉刷新,上拉加载更多的demo

接着上次来讲,这次来动手写一下listview的下拉刷新功能和上拉加载更多功能. 当然google在android4.0以上的API里面的提供了一个可以下拉加载更多的控件,这个小圆圈加载控件在豆瓣,知乎日报里面都有运用到,而我在下一篇博客也会提到. 先来了解一下最基本的listview的的加载功能吧. 首先是下拉刷新功能,我先说一下基本的思路.listveiw的面提供了一个addheader()方法,我们可以重写listview,然后用addheader方法加载我们自定义的加载布局.然后就是隐藏

better-scroll 上拉加载,下拉刷新(解决移动端长页面卡顿)

一.Better Scroll 滚动原理 1.下图能直观的表示better-scroll的滚动原理 2.html设置 <div class="wrapper"> <ul class="content"> <li>...</li> <li>...</li> ... </ul> <!-- 这里可以放一些其它的 DOM,但不会影响滚动 --> </div> 3.js

解决easyui中datagrid不分页加载大量数据渲染慢问题

easyui版本1.3.6 查看jquery.easyui.min.js源码,发现渲染数据时会调用函数_52a,会重置高度,进而增加渲染时间. 解决方法:设置datagrid的autoRowHeight: false. 原文地址:https://www.cnblogs.com/chenboxi/p/9398259.html