当前位置:首页 > 日记 > 正文

详解vue模拟加载更多功能(数据追加)

详解vue模拟加载更多功能(数据追加)

使用vue制作加载更多功能,通过ajax获取的数据往data里面push经常不成功,原因是push是往数组中追加数据内容的,而不能用作数组之间的拼接,ajax获取的数据就是数组形式的,因此不成功,应该使用concat()拼接两个数组。

//这是错误的写法$.ajax({     type:'get',    async:false,    url:path+'no/noticeMobile/getSendNoticeList?imToken='+ getToken +'&pageFlag=2',    dataType: "json",    success: function(msg){     _self.$set('loadMore', msg);     _self.conList.push(_self.loadMore);    }   });
//这是正确的写法$.ajax({     type:'get',    async:false,    url:path+'no/noticeMobile/getSendNoticeList?imToken='+ getToken +'&pageFlag=2',    dataType: "json",    success: function(msg){     _self.$set('main',_self.main.concat(msg))    }   });

模拟ajax数据加载测试效果如下:

总结:还是自己js基础知识不扎实,push和concat两个函数用法没有搞清楚,如果你有更好的方法欢迎讨论。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

相关文章

wps2013怎么绘制流程图

wps2013怎么绘制流程图

流程图,绘制,方法,电脑软件,  在日常工作中流程图用途广泛,经常被运用在文档中,但是但是对于大多数人来说还是不太懂,具体要怎么设置呢?下面给大家分享wps2013制作流程图的方法吧。wps2013制作流程图的方法打开WPS文字,点击下方绘图工具栏里…

word设置首行缩进的两种方法

word设置首行缩进的两种方法

方法,首行缩进,设置,两种,电脑软件,  首行缩进是中文文档最常见的缩进方式,在word中能很方便的实现这个功能。那么下面就由小编给大家分享下word设置首行缩进的技巧,希望能帮助到您。word设置首行缩进的方法一步骤一:首先打开自己的word文档…

经典个性签名超拽霸气qq个性签名大

经典个性签名超拽霸气qq个性签名大

推荐,霸气,个性签名,经典,优秀,  经典个性签名超拽霸气有哪些?纵观人类历史长河,非主流文化已绵延久矣,它的存在无时不刻在影响着社会的进步和人类的发展。当今社会,尤其是随着全球化、信息化、市场化的发展,非主流文化的影响更为显著。…

Word中2010版进行成绩表、点名册的

Word中2010版进行成绩表、点名册的

步骤,点名册,制作方法,成绩表,电脑软件,  Word2010成绩表、点名册制作方法是如何做到的呢?具体该怎么去进行操作?今天,小编就教大家在Word中2010版进行成绩表、点名册的制作方法。Word中2010版进行成绩表、点名册的制作步骤一、成绩表1.点…

word2010中如何对齐表格文字

word2010中如何对齐表格文字

文字,对齐,表格,电脑软件,  不管你是上班族还是学生族,总少不了使用文字处理软件。在众多的文字处理软件中,微软office中的Word目前在使用用户数量上处于领先地位。那么下面就由小编给大家分享下word2010中对齐表格文字的技巧,希望能帮助到…

Word中进行将所有进行批量设置居中

Word中进行将所有进行批量设置居中

设置,对齐,操作方法,批量,操作步骤,  当我们写论文的时候,可能会插入许多的图片,但是格式要求往往要求图片居中。假如在论文完成后,如何设置为让所有图片居中呢?今天,小编就教大家在Word中进行将所有图片进行批量设置居中对齐的操作方法。Wor…

ES6学习之变量的两种命名方法示例

ES6学习之变量的两种命名方法示例

方法,学习,变量,两种,示例,前言众所周知es6是ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。它完善了ES5的命…

AngularJS基于provider实现全局变

AngularJS基于provider实现全局变

赋值,全局变量,读取,方法,电脑软件,本文实例讲述了AngularJS基于provider实现全局变量的读取和赋值方法。分享给大家供大家参考,具体如下:简单全局变量的设置1,通过var 直接定义global variable,这根纯js是一样的。2,用angularjs value来设置全…

JavaScript基础之流程控制语句的用

JavaScript基础之流程控制语句的用

流程控制语句,基础,电脑软件,JavaScript,第三部分:流程控制语句JavaScript代码是书写位置:JavaScript代码应该写在<script type=”text/javascript”></script>这一对标记中。或者作为外部引用<script src="JavaScript代码路径"></script>J…

vue环境搭建简单教程

vue环境搭建简单教程

教程,环境搭建,简单,电脑软件,vue,要使用vue来开发前端框架,首先要有环境,这个环境要借助于node,所以要先安装node,借助于node里面的npm来安装需要的依赖等等。①安装nodejshttps://nodejs.org下载nodejs,(lts)安装的时候,点击同意,一路next就可以…

.net 应对网站访问压力的方案总结

.net 应对网站访问压力的方案总结

方案,网站,压力,电脑软件,net,开年比较空,抽时间写个博文,总结下自己工作里的一些应对网站访问压力的技术方案。自己项目现在大概一天50W的pv。已从前端到后端的顺序总结下自己用的一些方案。一. 前端页面:1.首先减少资源的大小,能用小图,就用小…

nodejs对express中next函数的一些

nodejs对express中next函数的一些

函数,电脑软件,nodejs,express,最近公司在使用node做前后端分离,采用的web框架是express,所以对express框架进行了深入的了解,前段时间写了篇关于express路由的文章,但是在那篇文章中貌似少了一个很重要的内容,就是express的next,所以今天单独来…