axios请求失败，TypeError: Cannot set property 'article' of undefined vue

最新推荐文章于 2024-05-09 13:10:55 发布

转载最新推荐文章于 2024-05-09 13:10:55 发布 · 345 阅读

Vue 专栏收录该内容

21 篇文章

订阅专栏

本文解决Vue项目中使用axios请求数据时遇到的TypeError错误。通过将匿名函数替换为箭头函数，修复了this指向问题，确保了组件状态能够正确更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

调试vue程序，使用axios请求后台报错，源码如下：

getGoodsList () {
       axios.get('/v1/random')
         .then(function (response) {
           this.article = 'sss'
           console.log(response.title)
           console.log(response)
         })
         .catch(function (error) {
           console.log(error)
         })
    }
  },

报错为：TypeError: Cannot set property ‘article’ of undefined vue
axios请求后article 发生变化，而我使用的是名字函数，this 关键字是匿名函数，vue实例，改成箭头函数就行，如下：

getGoodsList () {
      // axios.get('/v1/random')
      //   .then(function (response) {
      //     this.article = 'sss'
      //     console.log(response.title)
      //     console.log(response)
      //   })
      //   .catch(function (error) {
      //     console.log(error)
      //   })
      axios.get('/v1/random').then((response) => {
        this.article = 'sss'
      })
    }

--------------------- 本文来自周二也被占用的优快云博客，全文地址请点击：https://blog.youkuaiyun.com/u011350541/article/details/80458708?utm_source=copy