欢迎来到代码驿站!

vue

当前位置:首页 > 网页前端 > vue

使用Vue实现调用接口加载页面初始数据

时间:2020-12-22 17:18:52|栏目:vue|点击:

闲着没事写了一个电影推荐的网页,很简单,使用的是Vue的实现.

 let vm = new Vue({
  el:'#content',
  data:{
   name:'',
   pic:'',
   actor:'',
   detail:'',
   link:''
  },
  mounted:function () {
   this.getMovie();
  },
  methods:{
   getMovie:function () {
    var _this = this;
    let url = '/niuren/getRecommendFilm';
    axios.get(url).then(function (res) {
     _this.name = res.data.data.name;
     _this.pic = res.data.data.pic;
     _this.actor = res.data.data.actor;
     _this.detail = res.data.data.detail;
     _this.link =res.data.data.link;
    })
   },
   goLink:function () {
    var _this = this;
    window.location.href = _this.link;
   }
  },
 })

因为我使用的是axios, 在get方法中的this指向的这个函数,所以要在调用之前声明this的指向为Vue实例的this,

要不然就是赋值不成功,导致无法渲染(弄了半天)

上一篇:浅谈vue方法内的方法使用this的问题

栏    目:vue

下一篇:详解用vue-cli来搭建vue项目和webpack

本文标题:使用Vue实现调用接口加载页面初始数据

本文地址:http://www.codeinn.net/misctech/35291.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有