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 相关文章推荐
Javascript typeof 用法
Dec 28 Javascript
js textarea自动增高并隐藏滚动条
Dec 16 Javascript
js文本框输入点回车触发确定兼容IE、FF等
Nov 19 Javascript
javascript实现手机震动API代码
Aug 05 Javascript
JavaScript对象数组的排序处理方法
Oct 21 Javascript
通过点击jqgrid表格弹出需要的表格数据
Dec 02 Javascript
微信公众平台开发教程(六)获取个性二维码的实例
Dec 02 Javascript
js插件实现图片滑动验证码
Sep 29 Javascript
详解Vue快速零配置的打包工具——parcel
Jan 16 Javascript
Vuex的actions属性的具体使用
Apr 14 Javascript
jquery UI实现autocomplete在获取焦点时得到显示列表功能示例
Jun 04 jQuery
微信小程序实现签到弹窗动画
Sep 21 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
Get或Post提交值的非法数据处理
2006/10/09 PHP
php获取用户IPv4或IPv6地址的代码
2012/11/15 PHP
使用PHP强制下载PDF文件示例
2014/01/17 PHP
PHP 使用 Imagick 裁切/生成缩略图/添加水印自动检测和处理 GIF
2016/02/19 PHP
详解PHP中websocket的使用方法
2016/09/15 PHP
laravel项目利用twemproxy部署redis集群的完整步骤
2018/05/11 PHP
自己的js工具_Form 封装
2009/08/21 Javascript
javascript中setTimeout的问题解决方法
2014/05/08 Javascript
微信小程序 增、删、改、查操作实例详解
2017/01/13 Javascript
基于Angular.js实现的触摸滑动动画实例代码
2017/02/19 Javascript
ES6新特性之Symbol类型用法分析
2017/03/31 Javascript
php简单数据库操作类的封装
2017/06/08 Javascript
用Node提供静态文件服务的方法
2018/07/06 Javascript
React 实现拖拽功能的示例代码
2019/01/06 Javascript
通过原生vue添加滚动加载更多功能
2019/11/21 Javascript
ES6中的Javascript解构的实现
2020/10/30 Javascript
Python读写unicode文件的方法
2015/07/10 Python
Python实现嵌套列表及字典并按某一元素去重复功能示例
2017/11/30 Python
解决Matplotlib图表不能在Pycharm中显示的问题
2018/05/24 Python
Python使用pickle模块报错EOFError Ran out of input的解决方法
2018/08/16 Python
实例讲解python中的序列化知识点
2018/10/08 Python
pandas实现to_sql将DataFrame保存到数据库中
2019/07/03 Python
python模块常用用法实例详解
2019/10/17 Python
关于Keras Dense层整理
2020/05/21 Python
Python如何实现FTP功能
2020/05/28 Python
Python更改pip镜像源的方法示例
2020/12/01 Python
美国在线纱线商店:Darn Good Yarn
2019/03/20 全球购物
澳大利亚在线划船、露营和钓鱼商店:BCF Australia
2020/03/22 全球购物
会计专业推荐信
2013/10/29 职场文书
财务情况说明书范文
2014/05/06 职场文书
大学生求职自荐信范文
2015/03/04 职场文书
清明节文明祭祀倡议书
2015/04/28 职场文书
新闻报道稿范文
2015/07/23 职场文书
《家庭教育》读后感3篇
2019/12/18 职场文书
人民币符号
2022/02/17 杂记
详解Python+OpenCV绘制灰度直方图
2022/03/22 Python