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动态给table添加、删除行 改进版
Jan 19 Javascript
javascript代码加载优化方法
Jan 30 Javascript
javascript中删除指定数组中指定的元素的代码
Feb 12 Javascript
TimergliderJS 一个基于jQuery的时间轴插件
Dec 07 Javascript
通过JS自动隐藏手机浏览器的地址栏实现原理与代码
Jan 02 Javascript
JS 如何获取radio选中后的值及不选择取radio的值
Oct 28 Javascript
jQuery操作input值的各种方法总结
Nov 21 Javascript
jQuery实现简单的DIV拖动效果
Feb 19 Javascript
JS日程管理插件FullCalendar中文说明文档
Feb 06 Javascript
JS闭包的几种常见形式实例详解
Sep 16 Javascript
JS 实现百度搜索功能
Feb 01 Javascript
Vue路由守卫之路由独享守卫
Sep 25 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连接MySQL代码的参数说明
2008/06/07 PHP
PHP实现变色验证码实例
2014/01/06 PHP
PHP入门经历和学习过程分享
2014/04/11 PHP
PHP实现的浏览器检查类
2016/04/11 PHP
php入门教程之Zend Studio设置与开发实例
2016/09/09 PHP
ThinkPHP中Widget扩展的两种写法及调用方法详解
2017/05/04 PHP
Gird组件 Part-3:范例RSSFeed Viewer
2007/03/10 Javascript
js用正则表达式来验证表单(比较齐全的资源)
2013/11/17 Javascript
nodejs文件操作模块FS(File System)常用函数简明总结
2014/06/05 NodeJs
JS实现控制表格行内容垂直对齐的方法
2015/03/30 Javascript
详解jQuery中的empty、remove和detach
2016/04/11 Javascript
Vue中的数据监听和数据交互案例解析
2017/07/12 Javascript
vue 不使用select实现下拉框功能(推荐)
2018/05/17 Javascript
springMvc 前端用json的方式向后台传递对象数组方法
2018/08/07 Javascript
利用hasOwnProperty给数组去重的面试题分享
2018/11/05 Javascript
微信小程序 wx:for遍历循环使用实例解析
2019/09/09 Javascript
利用JS判断元素是否为数组的方法示例
2021/01/08 Javascript
pygame学习笔记(3):运动速率、时间、事件、文字
2015/04/15 Python
Python机器学习logistic回归代码解析
2018/01/17 Python
浅谈python正则的常用方法 覆盖范围70%以上
2018/03/14 Python
Python实现的爬虫刷回复功能示例
2018/06/07 Python
使用Anaconda3建立虚拟独立的python2.7环境方法
2018/06/11 Python
实例详解Matlab 与 Python 的区别
2019/04/26 Python
Python OpenCV 使用滑动条来调整函数参数的方法
2019/07/08 Python
Python脚本操作Excel实现批量替换功能
2019/11/20 Python
HTML5 Canvas 实现圆形进度条并显示数字百分比效果示例
2017/08/18 HTML / CSS
加拿大知名的国际儿童品牌:Hatley
2016/11/09 全球购物
家长写给老师的建议书
2014/03/13 职场文书
办公室主任竞聘演讲稿
2014/05/15 职场文书
房地产销售经理岗位职责
2015/02/02 职场文书
辞职信范文大全
2015/03/02 职场文书
学生犯错保证书
2015/05/09 职场文书
刮痧观后感
2015/06/05 职场文书
技能培训通讯稿
2015/07/18 职场文书
学习《中小学教师职业道德规范》心得体会
2016/01/18 职场文书
基于PyQT5制作一个桌面摸鱼工具
2022/02/15 Python