Vue2.X 通过AJAX动态更新数据


Posted in Javascript onJuly 17, 2018

最近在做一个跟美团同样一套预约系统,由于一个商家会有很多主题,而每个主题下面会有很多场次。

那怎么在一个页面把这些数据很好的动态展示出来呢?我首先想到了VUE的动态绑定数据。

由于第一次使用VUE,很多东西不懂,只能靠百度。服务器端返回的数据直接是JSON数据,初始数据完美的通过VUE渲染了出来,但是在切换主题显示场次信息的时候,出现了问题。发现数据是获取到了,但是VUE并没有对它进行渲染。

Vue2.X 通过AJAX动态更新数据 

var ndata = new Vue({
 el:'#playlist',
 data:{
 rows:{}
 },
 mounted: function() {
 var self = this;
 }
});
后来查了很多资料,通过以上方法,AJAX获取数据动态的成功绑定了数据
$.getJSON("URL, function(json){
//获取初始的数据
  ndata.rows = json;
});

总结

以上所述是小编给大家介绍的Vue2.X 通过AJAX动态更新数据,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Jquery数独游戏解析(一)-页面布局
Nov 05 Javascript
javascript中创建对象的几种方法总结
Nov 01 Javascript
jQuery实现表单步骤流程导航代码分享
Aug 28 Javascript
浅谈javascript的Array.prototype.slice.call
Aug 31 Javascript
js实现点击获取验证码倒计时效果
Jan 28 Javascript
浅谈Angular4实现热加载开发旅程
Sep 08 Javascript
用JavaScript做简易的购物车的代码示例
Oct 20 Javascript
vue将对象新增的属性添加到检测序列的方法
Feb 24 Javascript
angular6 填坑之sdk的方法
Dec 27 Javascript
微信小程序的mpvue框架快速上手指南
May 15 Javascript
Vue实现回到顶部和底部动画效果
Jul 31 Javascript
基于layui框架响应式布局的一些使用详解
Sep 16 Javascript
浅谈Angularjs中不同类型的双向数据绑定
Jul 16 #Javascript
微信小程序实现循环动画效果
Jul 16 #Javascript
mpvue 如何使用腾讯视频插件的方法
Jul 16 #Javascript
Vue实现自定义下拉菜单功能
Jul 16 #Javascript
vue实现城市列表选择功能
Jul 16 #Javascript
JavaScript字符串转数字的5种方法及遇到的坑
Jul 16 #Javascript
Angular-UI Bootstrap组件实现警报功能
Jul 16 #Javascript
You might like
php对gzip文件或者字符串解压实例参考
2008/07/25 PHP
PHP中include与require使用方法区别详解
2013/10/19 PHP
PHP获取数组中重复最多的元素的实现方法
2014/11/11 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
基于php编程规范(详解)
2017/08/17 PHP
thinkPHP框架整合tcpdf插件操作示例
2018/08/07 PHP
laravel框架中间件 except 和 only 的用法示例
2019/07/12 PHP
Laravel 6 将新增为指定队列任务设置中间件的功能
2019/08/06 PHP
关于Curl在Swoole协程中的解决方案详析
2019/09/12 PHP
php设计模式之组合模式实例详解【星际争霸游戏案例】
2020/03/27 PHP
jquery keypress,keyup,onpropertychange键盘事件
2010/06/25 Javascript
jquery ajax abort()的使用方法
2010/10/28 Javascript
十个迅速提升JQuery性能让你的JQuery跑得更快
2012/12/10 Javascript
Extjs4 关于Store的一些操作(加载/回调/添加)
2013/04/18 Javascript
基于JQuery的列表拖动排序实现代码
2013/10/01 Javascript
jsPDF导出pdf示例
2014/05/02 Javascript
jQuery实现购物车表单自动结算效果实例
2015/08/10 Javascript
详解Vue组件之间的数据通信实例
2017/06/17 Javascript
基于rem的移动端响应式适配方案(详解)
2017/07/07 Javascript
nodejs+mongodb+vue前后台配置ueditor的示例代码
2018/01/02 NodeJs
JSONP原理及应用实例详解
2018/09/13 Javascript
nuxt 页面路由配置,主页轮播组件开发操作
2020/11/05 Javascript
详解ES6 扩展运算符的使用与注意事项
2020/11/12 Javascript
Python中模拟enum枚举类型的5种方法分享
2014/11/22 Python
Python中pygame安装方法图文详解
2015/11/11 Python
python3 pillow生成简单验证码图片的示例
2017/09/19 Python
python实现遍历文件夹修改文件后缀
2018/08/28 Python
Python PyCharm如何进行断点调试
2019/07/05 Python
关于Python解包知识点总结
2020/05/05 Python
纯css3实现照片墙效果
2014/12/26 HTML / CSS
关于Assembly命名空间的三个面试题
2015/07/23 面试题
数字天堂软件测试面试题
2012/12/23 面试题
建筑系毕业生自我鉴定
2014/01/24 职场文书
社区活动总结报告
2014/05/05 职场文书
趣味运动会简讯
2015/07/20 职场文书
SSM VUE Axios详解
2021/10/05 Vue.js