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 相关文章推荐
jQuery autocomplete插件修改
Apr 17 Javascript
js setTimeout()函数介绍及应用以倒计时为例
Dec 12 Javascript
jquery div模态窗口的简单实例
May 28 Javascript
JavaScript暂停和继续定时器的实现方法
Jul 18 Javascript
JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】
Aug 19 Javascript
node.js缺少mysql模块运行报错的解决方法
Nov 13 Javascript
ES6中新增的Object.assign()方法详解
Sep 22 Javascript
详解Vue webapp项目通过HBulider打包原生APP
Jun 29 Javascript
原生JS实现前端本地文件上传
Sep 08 Javascript
Angular使用Restful的增删改
Dec 28 Javascript
jQuery中DOM常见操作实例小结
Aug 01 jQuery
JS设置自定义快捷键并实现图片上下左右移动
Oct 17 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
ajax php 实现写入数据库
2009/09/02 PHP
php中file_get_content 和curl以及fopen 效率分析
2014/09/19 PHP
一个用javascript写的select支持上下键、首字母筛选以及回车取值的功能
2009/09/09 Javascript
jquery ajax 登录验证实现代码
2009/09/23 Javascript
JavaScript 常用函数库详解
2009/10/21 Javascript
基于JQuery实现异步刷新的代码(转载)
2011/03/29 Javascript
javascript 快速排序函数代码
2012/05/30 Javascript
innerText和textContent对比及使用介绍
2013/02/27 Javascript
一个js控制的导航菜单实例代码
2013/12/03 Javascript
解决JS中乘法的浮点错误的方法
2014/01/03 Javascript
JS,Jquery获取select,dropdownlist,checkbox下拉列表框的值(示例代码)
2014/01/11 Javascript
js实现文本框中焦点在最后位置
2014/03/04 Javascript
table insertRow、deleteRow定义和用法总结
2014/05/14 Javascript
jQuery打印指定区域Html页面并自动分页
2014/07/04 Javascript
iframe调用父页面函数示例详解
2014/07/17 Javascript
js正则表达式匹配数字字母下划线等
2015/04/14 Javascript
JavaScript tab选项卡插件实例代码
2016/02/23 Javascript
js中获取键盘事件的简单实现方法
2016/10/10 Javascript
vue脚手架中配置Sass的方法
2018/01/04 Javascript
深入浅析AngularJs模版与v-bind
2018/07/06 Javascript
[原创]微信小程序获取网络类型的方法示例
2019/03/01 Javascript
Vue基础配置讲解
2019/11/29 Javascript
Vue登录拦截 登录后继续跳转指定页面的操作
2020/08/04 Javascript
Python开发之快速搭建自动回复微信公众号功能
2016/04/22 Python
Python实现base64编码的图片保存到本地功能示例
2018/06/22 Python
Python迭代器Iterable判断方法解析
2020/03/16 Python
python手机号前7位归属地爬虫代码实例
2020/03/31 Python
Python调用OpenCV实现图像平滑代码实例
2020/06/19 Python
Python json格式化打印实现过程解析
2020/07/21 Python
css3打造一款漂亮的卡哇伊按钮
2013/03/20 HTML / CSS
三星英国官网:Samsung英国
2018/09/25 全球购物
出生公证委托书
2014/04/03 职场文书
毕业生爱心捐书倡议书
2015/04/27 职场文书
2015年为民办实事工作总结
2015/05/26 职场文书
创业计划书之个人工作室
2019/08/22 职场文书
六年级作文之家庭作文
2019/12/12 职场文书