vue制作加载更多功能的正确打开方式


Posted in Javascript onOctober 12, 2016

使用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数据加载测试地址:https://jsfiddle.net/zhoou/96mnckgL/

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

Javascript 相关文章推荐
40款非常棒的jQuery 插件和制作教程(系列二)
Nov 02 Javascript
js修改地址栏URL参数解决url参数问题
Dec 15 Javascript
5款JavaScript代码压缩工具推荐
Jul 07 Javascript
Web程序员必备的7个JavaScript函数
Jun 14 Javascript
AngularJS入门教程之 XMLHttpRequest实例讲解
Jul 27 Javascript
JS实现双击内容变为可编辑状态
Mar 03 Javascript
Java与JavaScript中判断两字符串是否相等的区别
Mar 13 Javascript
Angular中innerHTML标签的样式不起作用的原因解析
Jun 18 Javascript
将RGB值转换为灰度值的简单算法
Oct 09 Javascript
vue element自定义表单验证请求后端接口验证
Dec 11 Javascript
js实现简易计算器小功能
Nov 18 Javascript
vue+element UI实现树形表格
Dec 29 Vue.js
将form表单通过ajax实现无刷新提交的简单实例
Oct 12 #Javascript
深入理解Node.js的HTTP模块
Oct 12 #Javascript
纯js实现手风琴效果代码
Apr 17 #Javascript
JavaScript 继承详解(六)
Oct 11 #Javascript
JavaScript 继承详解(五)
Oct 11 #Javascript
Javascript动画效果(4)
Oct 11 #Javascript
JavaScript中const、var和let区别浅析
Oct 11 #Javascript
You might like
PHP 批量删除数据的方法分析
2009/10/30 PHP
Joomla下利用configuration.php存储简单数据
2010/05/19 PHP
php中设置index.php文件为只读的方法
2013/02/06 PHP
浅谈PHPANALYSIS提取关键字
2019/03/08 PHP
3分钟写出来的Jquery版checkbox全选反选功能
2013/10/23 Javascript
解析Javascript中大括号“{}”的多义性
2013/12/02 Javascript
Javascript中匿名函数的多种调用方式总结
2013/12/06 Javascript
使用jquery prev()方法找到同级的前一个元素
2014/07/11 Javascript
jQuery命名空间与闭包用法示例
2017/01/12 Javascript
JavaScript程序设计高级算法之动态规划实例分析
2017/11/24 Javascript
详解mpvue开发小程序小总结
2018/07/25 Javascript
vue+axios实现文件下载及vue中使用axios的实例
2018/09/21 Javascript
详解一个小实例理解js原型和继承
2019/04/24 Javascript
微信小程序 SOTER 生物认证DEMO 指纹识别功能
2019/12/13 Javascript
Vue路由管理器Vue-router的使用方法详解
2020/02/05 Javascript
微信小程序动态添加和删除组件的现实
2020/02/28 Javascript
原生JavaScript创建不可变对象的方法简单示例
2020/05/07 Javascript
angular共享依赖的解决方案分享
2020/10/15 Javascript
python爬虫入门教程--正则表达式完全指南(五)
2017/05/25 Python
在Python的一段程序中如何使用多次事件循环详解
2017/09/07 Python
在Windows中设置Python环境变量的实例讲解
2018/04/28 Python
对Python生成汉字字库文字,以及转换为文字图片的实例详解
2019/01/29 Python
python制作英语翻译小工具代码实例
2019/09/09 Python
Python 实现Numpy中找出array中最大值所对应的行和列
2019/11/26 Python
tensorflow使用L2 regularization正则化修正overfitting过拟合方式
2020/05/22 Python
Python 使用SFTP和FTP实现对服务器的文件下载功能
2020/12/17 Python
推荐WEB开发者最佳HTML5和CSS3代码生成器
2015/11/24 HTML / CSS
详解淘宝H5 sign加密算法
2020/08/25 HTML / CSS
迟到检讨书800字
2014/01/13 职场文书
大堂副理的岗位职责范文
2014/02/17 职场文书
建筑横幅标语
2014/10/09 职场文书
政风行风评议工作总结
2014/10/21 职场文书
人事行政主管岗位职责
2015/04/09 职场文书
意外事故赔偿协议书
2016/03/22 职场文书
python 逐步回归算法
2021/04/06 Python
Java面试题冲刺第十六天--消息队列
2021/08/07 面试题