发布于 2017-05-05 14:04:45 | 175 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Vue.js 教程,程序狗速度看过来!

Vue.js 轻量级 JavaScript 框架

Vue.js 是构建 Web 界面的 JavaScript 库,提供数据驱动的组件,还有简单灵活的 API,使得 MVVM 更简单。


这篇文章主要给大家介绍了vue.js实现请求数据的方法示例,文中分别介绍了vue1.0和vue2.0的示例方法,需要的朋友可以参考借鉴,下面来一起看看吧。

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 请求数据的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。



相关阅读 :
vue.js实现请求数据的方法示例
vue.js实现价格格式化的方法
使用vue.js实现联动效果的示例代码
利用webstrom调试Vue.js单页面程序的方法教程
vue jsx 使用指南及vue.js 使用jsx语法的方法
使用Bootstrap + Vue.js实现添加删除数据示例
vue.js实现数据动态响应 Vue.set的简单应用
在vue.js中抽出公共代码的方法示例
Vue.js实现多条件筛选、搜索、排序及分页的表格功能
使用vue.js实现checkbox的全选和多个的删除功能
Vue.js实现简单动态数据处理
利用Vue.js实现checkbox的全选反选效果
最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务