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初学:find()方法及children方法的区别分析
Jan 31 Javascript
jquery 操作日期、星期、元素的追加的实现代码
Feb 07 Javascript
js实现局部页面打印预览原理及示例代码
Jul 03 Javascript
javascript二维数组转置实例
Jan 22 Javascript
ES6通过babel转码使用webpack使用import关键字
Dec 13 Javascript
JS去除字符串中空格的方法
Feb 14 Javascript
Element-ui table中过滤条件变更表格内容的方法
Mar 02 Javascript
理解 JavaScript EventEmitter
Mar 29 Javascript
Vue中使用clipboard实现复制功能
Sep 05 Javascript
详解Vue.js iview实现树形权限表(可扩展表)
Sep 30 Javascript
理理Vue细节(推荐)
Apr 16 Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 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
用PHP制作静态网站的模板框架
2006/10/09 PHP
ie与session丢失(新窗口cookie丢失)实测及解决方案
2013/07/15 PHP
PHP CURL获取返回值的方法
2014/05/04 PHP
php类常量用法实例分析
2015/07/09 PHP
php利用gd库为图片添加水印
2016/11/09 PHP
JavaScript-世界上误解最深的语言分析
2007/08/12 Javascript
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
2010/03/23 Javascript
中国地区三级联动下拉菜单效果分析
2012/11/15 Javascript
使用CSS样式position:fixed水平滚动的方法
2014/02/19 Javascript
Jquery倒计时源码分享
2014/05/16 Javascript
JavaScript常用标签和方法总结
2015/09/01 Javascript
全面解析Bootstrap中tooltip、popover的使用方法
2016/06/13 Javascript
JS遍历页面所有对象属性及实现方法
2016/08/01 Javascript
jQuery时间日期三级联动(推荐)
2016/11/27 Javascript
利用Vue.js框架实现火车票查询系统(附源码)
2017/02/27 Javascript
开发Vue树形组件的示例代码
2017/12/21 Javascript
ES6 Object方法扩展的应用实例分析
2019/06/25 Javascript
详解Vue-cli3.X使用px2rem遇到的问题
2019/08/09 Javascript
JavaScript 接口原理与用法实例详解
2020/05/12 Javascript
Vue使用轮询定时发送请求代码
2020/08/10 Javascript
原生微信小程序开发中 redux 的使用详解
2021/02/18 Javascript
Python使用progressbar模块实现的显示进度条功能
2018/05/31 Python
python仿抖音表白神器
2019/04/08 Python
Python八皇后问题解答过程详解
2019/07/29 Python
Pytorch训练过程出现nan的解决方式
2020/01/02 Python
jupyter notebook 增加kernel教程
2020/04/10 Python
基于python 凸包问题的解决
2020/04/16 Python
python中类与对象之间的关系详解
2020/12/16 Python
如何查看浏览器对html5的支持情况
2020/12/15 HTML / CSS
Booking.com亚太地区:Booking.com APAC
2020/02/07 全球购物
Linux文件操作命令都有哪些
2015/02/27 面试题
业务员岗位职责
2013/11/16 职场文书
个人求职信范文分享
2014/01/31 职场文书
八项规定对照检查材料
2014/08/31 职场文书
立志成才演讲稿
2014/09/04 职场文书
2016新年致辞
2015/08/01 职场文书