vue 分包加载,vue 如何将分段视频分别保存
本文主要介绍如何通过Vue批量加载数据，具有很好的参考价值。希望对大家有帮助。如有错误或不足之处，请不吝赐教。
目录
批量装载数据和滚动装载数据
分批加载数据
最近在写一个vue项目。因为从后台返回的数据量太大，当我调用高德地图来渲染‘多边形’封面时，我无法处理它，它就这样跳出来了。然后后台的小哥跟我说可以批量办理~没想到快了很多。千变万变不如用手去过~，就记录在这里吧！
首先我们需要定义四个全局的变量
Pagindex页码pagesize一个页面应该请求多少条数据？pagetotal应该被请求多少次(总数/页面大小)？它始终是后台返回的~intertimer中存储的定时器的函数，方便清除定时器导出默认值{
名称：地图应用，
注入：[reload]，
data() {
返回{
Pagindex: 1，//页码
Pagesize: 300，//页数/文章数
Pagetotal: 0，//请求总数
Intertimer: null，//timer
}
}
}
然后在methods中编写一个定时器，让定时器每三秒执行一次方法；
//计时器
getPageInter(map) {
this . loading=this . loading({//加载图层
锁：真的，
正文：“拼命加载”，
微调器：“el图标加载”，
背景： rgba(0，0，0，0.7)
});
this . intertimer=setInterval(()={
this.intervalData(地图)；//每隔三秒调用一次方法
}, 3000);
},
然后用这个方法，我们来做一个判断。如果当前请求的页面数量超过请求总数，我们将知道计时器！
//定时器2
区间数据(地图){
if(this . pagindex this . page total){
clear interval(this . inter timer)；//关闭计时器
this . loading . close()；//关闭弹出窗口
this . pagindex=1；
}否则{
this.renderMesh(地图)；//数据呈现
this . pagindex=1；
}
},
是后台的小哥返回的，然后我们每次请求接口，都要给后台发当前页面，以及需要请求多少条数据。
渲染网格(贴图){
这个。$axios。get(this . http API /API/Main/get block map ，{
参数：{
块代码：this.pageid，
Page: this.pagindex，//当前页码
Rownum: this.pagesize //请求数
}
})。然后(res={
console . log(RES)；
})。catch(错误={
Console.log(请求失败233 )；
});
}
因为我的总数是另一个接口调用的，然后写代码也一样。
这个。$axios。get(this . http API /API/Main/GetBlockMapCount ，{
参数：{
BlockCode: this.pageid
}
})。然后(res={
let JSON data=eval(( RES . data ))；
//总数除以每次请求的数据量，得到请求总数。
this . page total=math . ceil(JSON data . totals/this . pagesize)；
})。catch(错误={
Console.log(请求失败)；
});
滚动加载数据
核心方法：
handleScroll: function () {
var scrollTop=
document . document element . scroll top document . body . scroll top；
var窗口高度=
document . document element . client height document . body . client height；
var scrollHeight=
document . document element . scroll height document . body . scroll height；
if(scroll top windowHeitht=scroll height-2000){
如果(this.scroll) {
这个。GetSpecialData()；
}
}
},
GetSpecialData() {
this.scroll=false
this . page . page index；
this.load(this.page，this . query)；
},
监视器：
已安装(){
window . addevent listener( scroll ，this . handle scroll)；
},
销毁(){
window . removeeventlistener( scroll ，this.handleScroll，false)；
},
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。