vue this is undefined

最新推荐文章于 2024-08-19 11:03:35 发布

原创最新推荐文章于 2024-08-19 11:03:35 发布 · 497 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#java #html #es6

vue 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一个在使用axios过程中常见的问题，即在Vue中由于this指向问题导致的数据无法正常更新，并提供了解决方案——使用箭头函数来保持正确的上下文。

在使用axios经常会出现这个问题

如下面代码

data(){
  return{
    goods:{
      title:null,
      subTitle:null,
      originalCost:null,
      currentPrice:null,
      discount:null,
      isFreeDelivery:null
    }
  }
},

  mounted:function()
  {//this is undefined
    axios.get("http://localhost:8081/get/goods/749").then(function (response){
      console.log(response);
      var _this = this;
      _this.goods = response.data;
    });

修改后：只需要将function换成=> 箭头函数就可以了

mounted:function()
  {
    axios.get("http://localhost:8081/get/goods/749").then((response)=>{
      console.log(response);
      var _this = this;
      _this.goods = response.data;
    });