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 相关文章推荐
修改jquery.lazyload.js实现页面延迟载入
Dec 22 Javascript
用js获取电脑信息(是使用与IE浏览器)
Jan 15 Javascript
关于JS管理作用域的问题
Apr 10 Javascript
动态读取JSON解析键值对的方法
Jun 03 Javascript
js实现鼠标感应向下滑动隐藏菜单的方法
Feb 20 Javascript
jQuery EasyUi实战教程之布局篇
Jan 26 Javascript
几种经典排序算法的JS实现方法
Mar 25 Javascript
Node.JS利用PhantomJs抓取网页入门教程
May 19 Javascript
ES6关于Promise的用法详解
May 07 Javascript
Vuex 在Vue 组件中获得Vuex 状态state的方法
Aug 27 Javascript
微信小程序云开发 生成带参小程序码流程
May 18 Javascript
react国际化react-intl的使用
May 06 Javascript
将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
用Zend Studio+PHPnow+Zend Debugger搭建PHP服务器调试环境步骤
2014/01/19 PHP
PHP Callable强制指定回调类型的方法
2016/08/30 PHP
php+mysql开发中的经验与常识小结
2019/03/25 PHP
JQuery 简便实现页面元素数据验证功能
2007/03/24 Javascript
jQuery dialog 异步调用ashx,webservice数据的代码
2010/08/03 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
2014/04/02 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
2016/04/29 Javascript
Ext JS框架中日期函数的用法及日期选择控件的实现
2016/05/21 Javascript
Boostrap基础教程之JavaScript插件篇
2016/09/08 Javascript
vue.js从安装到搭建过程详解
2017/03/17 Javascript
用js将long型数据转换成date型或datetime型的实例
2017/07/03 Javascript
微信小程序之绑定点击事件实例详解
2017/07/07 Javascript
nodejs实现爬取网站图片功能
2017/12/14 NodeJs
一文快速了解JQuery中的AJAX
2019/05/31 jQuery
微信小程序如何实现在线客服功能
2019/10/16 Javascript
纯 JS 实现放大缩小拖拽功能(完整代码)
2019/11/25 Javascript
[01:50]WODOTA制作 DOTA2中文宣传片《HERO》
2013/04/28 DOTA
python实现巡检系统(solaris)示例
2014/04/02 Python
python抓取网页图片并放到指定文件夹
2014/04/24 Python
python中模块的__all__属性详解
2017/10/26 Python
Python实现端口检测的方法
2018/07/24 Python
Python使用线程来接收串口数据的示例
2019/07/02 Python
python提取log文件内容并画出图表
2019/07/08 Python
如何基于Python实现电子邮件的发送
2019/12/16 Python
pytorch 模拟关系拟合——回归实例
2020/01/14 Python
Pytorch模型转onnx模型实例
2020/01/15 Python
python与idea的集成的实现
2020/11/20 Python
目前不被任何主流浏览器支持的CSS3属性汇总
2014/07/21 HTML / CSS
Shopee印度尼西亚:东南亚与台湾市场最大电商平台
2018/06/17 全球购物
美国领先的家庭智能音响系统品牌:Sonos
2018/07/20 全球购物
三好学生自我鉴定
2013/12/17 职场文书
心理健康课教学反思
2014/02/13 职场文书
公司离职证明标准格式
2014/11/18 职场文书
2014年医药代表工作总结
2014/11/22 职场文书
惹女朋友生气检讨书
2015/05/06 职场文书
深入浅出的讲解:信号调制到底是如何实现的
2022/02/18 无线电