vue.js实现请求数据的方法示例


Posted in Javascript onFebruary 07, 2017

vue2.0示例代码如下:

var vm = new Vue({
      el:"#list",
      data:{
        gridData: "",
      },
      mounted: function() {
        this.$nextTick(function () {
          this.$http.jsonp('http://***.com').then(function(res) {
            console.log(res.data)
            this.gridData = res.data;
          })
        })
      },
    })

vue2.0版本废弃了ready定义的方法,使用mounted来代替,不过需要加上this.$nextTick(function(){})

如果没有请求成功看一下vuejs的版本

1.0版本的写法是这样的

var vm = new Vue({
  el:"#list",
  data:{
    gridData: '',
  },
  ready: function() {
    this.$http.jsonp('http://***.com').then(function(res){
      this.$set('gridData', res.data);
    })
  },
})

总结

以上就是关于vue.js 请求数据的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
JavaScript 异步调用框架 (Part 6 - 实例 & 模式)
Aug 04 Javascript
javascript实现获取字符串hash值
May 10 Javascript
JavaScript中数组继承的简单示例
Jul 29 Javascript
js实现带圆角的两级导航菜单效果代码
Aug 24 Javascript
使用vue.js制作分页组件
Jun 27 Javascript
js倒计时简单实现代码
Aug 11 Javascript
微信小程序 navigation API实例详解
Oct 02 Javascript
webpack入门+react环境配置
Feb 08 Javascript
discuz表情的JS提取方法分析
Mar 22 Javascript
IntelliJ IDEA 安装vue开发插件的方法
Nov 21 Javascript
JS基于Location实现访问Url、重定向及刷新页面的方法分析
Dec 03 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
Jan 26 Javascript
Avalonjs 实现简单购物车功能(实例代码)
Feb 07 #Javascript
深入理解JavaScript中的尾调用(Tail Call)
Feb 07 #Javascript
基于JavaScript实现下拉列表左右移动代码
Feb 07 #Javascript
原生JavaScript实现AJAX、JSONP
Feb 07 #Javascript
[原创]SyntaxHighlighter自动识别并加载脚本语言
Feb 07 #Javascript
javascript表达式和运算符详解
Feb 07 #Javascript
利用jQuery实现滑动开关按钮效果(附demo源码下载)
Feb 07 #Javascript
You might like
PHP Smarty生成EXCEL文档的代码
2008/08/23 PHP
php实现四舍五入的方法小结
2015/03/03 PHP
php获取英文姓名首字母的方法
2015/07/13 PHP
PHP单例模式详解及实例代码
2016/12/21 PHP
php使用curl获取header检测开启GZip压缩的方法
2018/08/15 PHP
PHP查找一列有序数组是否包含某值的方法
2020/02/07 PHP
JS在IE和FF下attachEvent,addEventListener学习笔记
2009/11/26 Javascript
Javascript开发之三数组对象实例介绍
2012/11/12 Javascript
JavaScript 模式之工厂模式(Factory)应用介绍
2012/11/15 Javascript
固定表格行列(expression)在IE下适用
2013/07/25 Javascript
node.js中的path.dirname方法使用说明
2014/12/09 Javascript
js倒计时显示实例
2016/12/11 Javascript
jQuery+pjax简单示例汇总
2017/04/21 jQuery
Node.js中sequelize时区的配置方法
2017/12/10 Javascript
webpack v4 从dev到prd的方法
2018/04/02 Javascript
JavaScript 判断对象中是否有某属性的常用方法
2018/06/14 Javascript
Vue微信公众号网页分享的示例代码
2020/05/28 Javascript
Vue自定义表单内容检查rules实例
2020/10/30 Javascript
[05:14]辉夜杯主赛事第二日 RECAP精彩回顾
2015/12/27 DOTA
python实现获取客户机上指定文件并传输到服务器的方法
2015/03/16 Python
Python打印scrapy蜘蛛抓取树结构的方法
2015/04/08 Python
python通过smpt发送邮件的方法
2015/04/30 Python
python 循环while和for in简单实例
2016/08/16 Python
Python  Django 母版和继承解析
2019/08/09 Python
numpy 声明空数组详解
2019/12/05 Python
Python运行异常管理解决方案
2020/03/09 Python
Python二元算术运算常用方法解析
2020/09/15 Python
css3圆角边框和边框阴影示例
2014/05/05 HTML / CSS
农救科工作职责
2013/11/27 职场文书
大学学雷锋活动总结
2014/06/26 职场文书
亮剑观后感500字
2015/06/05 职场文书
迎新生晚会主持词
2015/06/30 职场文书
golang日志包logger的用法详解
2021/05/05 Golang
pytorch finetuning 自己的图片进行训练操作
2021/06/05 Python
教你用Python matplotlib库制作简单的动画
2021/06/11 Python
关于的python五子棋的算法
2022/05/02 Python