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的ajax功能实现的RSS Reader 代码
Sep 03 Javascript
jQuery的deferred对象使用详解
Aug 20 Javascript
用最通俗易懂的代码帮助新手理解javascript闭包 推荐
Mar 01 Javascript
JavaScript验证18位身份证号码最后一位正确性的实现代码
Aug 07 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
Oct 28 Javascript
跟我学习javascript的异步脚本加载
Nov 20 Javascript
使用Bootstrap typeahead插件实现搜索框自动补全的方法
Jul 07 Javascript
关于JSON与JSONP简单总结
Aug 16 Javascript
JavaScript trim 实现去除字符串首尾指定字符的简单方法
Dec 27 Javascript
vue2.0 axios跨域并渲染的问题解决方法
Mar 08 Javascript
vue中组件的3种使用方式详解
Mar 23 Javascript
Js实现复选框的全选、全不选反选功能代码实例
Feb 28 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
用 Composer构建自己的 PHP 框架之使用 ORM
2014/10/30 PHP
PHP中定义数组常量(array常量)的方法
2014/11/17 PHP
初识laravel5
2015/03/02 PHP
php银联网页支付实现方法
2015/03/04 PHP
PHP实现WebService的简单示例和实现步骤
2015/03/27 PHP
javascript Base类 包含基本的方法
2009/07/22 Javascript
JQuery 解析多维的Json数据格式
2009/11/02 Javascript
Javascript 复制数组实现代码
2009/11/26 Javascript
Uglifyjs(JS代码优化工具)入门 安装使用
2020/04/13 Javascript
20行代码实现的一个CSS覆盖率测试脚本
2013/07/07 Javascript
jquery组件WebUploader文件上传用法详解
2020/10/23 Javascript
Javascript 实现全屏滚动实例代码
2016/12/31 Javascript
Angularjs中使用layDate日期控件示例
2017/01/11 Javascript
js实现日历与定时器
2017/02/22 Javascript
ReactNative之键盘Keyboard的弹出与消失示例
2017/07/11 Javascript
通俗解释JavaScript正则表达式快速记忆
2017/08/23 Javascript
jQuery Dom元素操作技巧
2018/02/04 jQuery
webstorm中vue语法的支持详解
2018/05/09 Javascript
JavaScript之实现一个简单的Vue示例
2019/01/17 Javascript
JS使用对象的defineProperty进行变量监控操作示例
2019/02/02 Javascript
Jquery 动态添加元素并添加点击事件实现过程解析
2019/10/12 jQuery
Vue使用vue-draggable 插件在不同列表之间拖拽功能
2020/03/12 Javascript
tensorflow1.0学习之模型的保存与恢复(Saver)
2018/04/23 Python
pycharm 安装JPype的教程
2019/08/08 Python
python下载库的步骤方法
2019/10/12 Python
python3.6、opencv安装环境搭建过程(图文教程)
2019/11/05 Python
详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
2016/03/22 HTML / CSS
德国机场停车位比较和预订网站:Ich-parke-billiger
2018/01/08 全球购物
五年级音乐教学反思
2014/02/06 职场文书
教师节促销活动方案
2014/02/14 职场文书
法人代表授权委托书范文
2014/09/10 职场文书
银行先进个人总结
2015/02/15 职场文书
罗马假日观后感
2015/06/08 职场文书
趣味运动会标语口号
2015/12/26 职场文书
如何利用golang运用mysql数据库
2022/03/13 Golang
MySQL派生表联表查询实战过程
2022/03/20 MySQL