vue 上拉加载更多
var _this=this;
var goods_id = _this.$route.query.id;
var isscroll = true;
_this.$nextTick(() => {
var el = document.querySelector(".rating_cnt_scroll");
var offsetHeight = el.offsetHeight;
el.onscroll = () => {
var scrollTop = el.scrollTop;
var scrollHeight = el.scrollHeight;
if (offsetHeight + scrollTop - scrollHeight >= -1) {
if(isscroll==true){
isscroll = false;
var requestData = [];
_this.mountedPage++;
console.log(_this.mountedPage);
isscroll = false;
var data = {
goods_id: goods_id,
page: _this.mountedPage,
checkData: _this.$md5("caiegouinterface")
};
_this.$http.post(baseUrl + "/api/Goods/getEvaluate", data, {emulateJSON: true})
.then(res => {
if(res.body.code==200){
requestData = res.body.data.evaluate;
if (res.body.data.length == 0) {
//_this.page=1;
isscroll = true;
return false;
}
}
});
}
setTimeout(() => {
_this.evaluate = _this.evaluate.concat(requestData);
isscroll = true;
}, 100);
}
}
})
vue 上拉加载更多的更多相关文章
- vux, vue上拉加载更多
<template> <" :bottom-method="loadBottom" :bottom-all-loaded="bottomAll ...
- vue mpvue 上拉加载更多示例代码
vue 上拉加载更多示例代码 可以比较简单的改为 mpvue , 去除滚动判断,直接放在 onReachBottom 周期即可. html <div id="app"> ...
- vue移动端上拉加载更多
LoadMore.vue <template> <div class="load-more-wrapper" @touchstart="touchSta ...
- vue实现网络图片瀑布流 + 下拉刷新 + 上拉加载更多
一.思路分析和效果图 用vue来实现一个瀑布流效果,加载网络图片,同时有下拉刷新和上拉加载更多功能效果.然后针对这几个效果的实现,捋下思路: 根据加载数据的顺序,依次追加标签展示效果: 选择哪种方式实 ...
- mui的上拉加载更多 下拉刷新 自己封装的demo
----------------------------------------------- 这是一个非常呆萌的程序妹子,深夜码的丑代码------------------------------- ...
- vue2.0 移动端,下拉刷新,上拉加载更多插件,修改版
在[实现丰盛]的插件基础修改[vue2.0 移动端,下拉刷新,上拉加载更多 插件], 1.修改加载到尾页面,返回顶部刷新数据,无法继续加重下一页 2.修改加载完成文字提示 原文链接:http://ww ...
- mui实现分页上拉加载更多 下拉刷新数据的简单实现 移动端下拉上拉
空下来把mui上拉加载更多,下拉刷新数据做了一个简单的实现,希望可以帮助到需要的朋友 demo项目的结构 <!DOCTYPE html> <html> <head> ...
- 原生js移动端touch事件实现上拉加载更多
大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...
- H5基于iScroll实现下拉刷新,上拉加载更多
前言 前一段有个手机端的项目需要用到下拉刷新和上拉加载更多的效果,脑海里第一反映就是微博那种效果,刚开始的理解有些偏差,以为下拉也是追加数据,上拉也是追加数据,后请教同事后发现其实下拉只是刷新最新数据 ...
随机推荐
- 修剪草坪 单调队列优化dp BZOJ2442
题目描述 在一年前赢得了小镇的最佳草坪比赛后,Farm John变得很懒,再也没有修剪过草坪.现在,新一轮的最佳草坪比赛又开始了,Farm John希望能够再次夺冠. 然而,Farm John的草坪非 ...
- Matlab2015 双目相机自动标定
标定步骤 调出标定工具箱 在命令行输入stereoCameraCalibrator,出现如下界面: 勾选相应的选项 然后将上面的“Skew”.“Tangential Distortion”以及“3 C ...
- mysql数据库分库分表shardingjdbc
分库分表理解 分库分表应用于互联网的两个场景;大量数据和高并发,通常策略有两种:垂直分库,水平拆分 垂直拆分:是根据业务将一个库拆分为多个库,将一个表拆分为多个表,例如:将不常用的字段和经常访问的字段 ...
- Qt 学习之路 2(62):保存 XML
Home / Qt 学习之路 2 / Qt 学习之路 2(62):保存 XML Qt 学习之路 2(62):保存 XML 豆子 2013年8月26日 Qt 学习之路 2 9条评论 前面几章我们 ...
- oracle数据库修改密码
忘记了数据库的登录密码,oracle数据库无法登录了. 先删除原先的密码保存文件: del E:\oracle_app\Administrator\product\11.2.0\dbhome_1\da ...
- 浅谈C#数组(一)
如果需要使用同一类型的多个对象,可以使用数组和集合(后面介绍).C#用特殊的记号声明,初始化和使用数组.Array类在后台发挥作用,它为数组中的元素排序和过滤提供了多个方法.使用枚举器,可以迭代数组中 ...
- MySQL 简洁 数据操作 增删改查 记不住的 看这里把
1.库操作====================== 1.创建 CREATE DATABASE DB2 charset utf8; 2.删除 DROP DATABASE db2; 3.使用(进入) ...
- 【DP】【构造】NOIp模拟题 演讲 题解
极其考思维的好题 题目背景 众所周知,$\mathrm{Zdrcl}$是一名天天$\mathrm{AK}$的高水平选手. 作为一民长者,为了向大家讲述自己$\mathrm{AK}$的经验,他决 ...
- FLUENT 流体计算应用教程
温正 清华大学出版 2013.1 子谓颜渊曰,用之则行,舍之则藏,惟我与尔有是夫! 非常合适的一本书. ...
- IOS不支持overflow: hidden;
IOS不支持overflow: hidden; 假设页面上有个弹出窗,弹出窗出现后,只想让用户的视觉锁定在弹出窗上,正常我们会想到用overflow:hidden这个属性来实现,如下 html{ ov ...