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 相关文章推荐
[Web]防止用户复制页面内容和另存页面的方法
Feb 06 Javascript
禁止ajax缓存获取程序最新数据的方法
Nov 19 Javascript
javascript中实现兼容JAVA的hashCode算法代码分享
Aug 11 Javascript
JavaScript中String.match()方法的使用详解
Jun 06 Javascript
jquery实现的Accordion折叠面板效果代码
Sep 02 Javascript
jQuery EasyUI 入门必看
Jun 03 Javascript
浅谈JS中json数据的处理
Jun 30 Javascript
jQuery解析XML 详解及方法总结
Sep 28 Javascript
jquery实现(textarea)placeholder自动换行
Dec 22 Javascript
Vee-Validate的使用方法详解
Sep 22 Javascript
jquery实现左右轮播图效果
Sep 28 jQuery
浅谈layui框架自带分页和表格重载的接口解析问题
Sep 11 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实现的堆排序算法详解
2017/08/17 PHP
用JavaScript 处理 URL 的两个函数代码
2007/08/13 Javascript
js改变embed标签src值的方法
2015/04/10 Javascript
javascript入门教程基础篇
2015/11/16 Javascript
nodejs初步体验篇
2015/11/23 NodeJs
基于AGS JS开发自定义贴图图层
2017/03/31 Javascript
重新认识vue之事件阻止冒泡的实现
2018/08/02 Javascript
AJAX在JQuery中的应用详解
2019/01/30 jQuery
vue实现滑动超出指定距离回顶部功能
2019/07/31 Javascript
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
2019/11/14 Javascript
微信小程序调用wx.getImageInfo遇到的坑解决
2020/05/31 Javascript
浅谈js中的attributes和Attribute的用法与区别
2020/07/16 Javascript
vue中v-for循环选中点击的元素并对该元素添加样式操作
2020/07/17 Javascript
vue实现在进行增删改操作后刷新页面
2020/08/05 Javascript
详解如何在vue+element-ui的项目中封装dialog组件
2020/12/11 Vue.js
[01:03:59]2018DOTA2亚洲邀请赛3月30日 小组赛B组VGJ.T VS Secret
2018/03/31 DOTA
Python 元组(Tuple)操作详解
2014/03/11 Python
Python实现partial改变方法默认参数
2014/08/18 Python
Python对文件操作知识汇总
2016/05/15 Python
在python3环境下的Django中使用MySQL数据库的实例
2017/08/29 Python
浅析PHP与Python进行数据交互
2018/05/15 Python
Python3.5装饰器原理及应用实例详解
2019/04/30 Python
Python3 利用face_recognition实现人脸识别的方法
2020/03/13 Python
Python如何将字符串转换为日期
2020/07/31 Python
Python从MySQL数据库中面抽取试题,生成试卷
2021/01/14 Python
CSS3模拟IOS滑动开关效果
2016/09/28 HTML / CSS
详解CSS3原生支持div铺满浏览器的方法
2018/08/30 HTML / CSS
美国开幕式潮店:Opening Ceremony
2018/02/10 全球购物
个人评语大全
2014/05/04 职场文书
投资意向书
2014/07/30 职场文书
领导干部“四风”问题批评与自我批评材料
2014/09/24 职场文书
个人纪律作风整改措施思想汇报
2014/10/12 职场文书
2016年感恩节活动总结大全
2016/04/01 职场文书
Python Pycharm虚拟下百度飞浆PaddleX安装报错问题及处理方法(亲测100%有效)
2021/05/24 Python
Python中的 Set 与 dict
2022/03/13 Python
vue elementUI表格控制对应列
2022/04/13 Vue.js