vue整合的axios(Bug)

vue整合axios(Bug)

在项目中需要用到后台的数据对前端渲染,使用到了vue整合的axios,使用vue中的钩子函数在页面组件挂载完成之后向后台发送一个get请求然后将返回后的数据赋值data()中定义的属性:

img

执行后页面报错:

img

原因分析:

在请求执行成功后执行回调函数中的内容,回调函数处于其它函数的内部this不会与任何对象绑定,为undefined。也就是说方法中的 this 指的是当前 function 中的,但是该函数中并没有 forklifts 属性,所以报undefined

解决方案:

箭头函数

箭头函数特点

  • 箭头函数作为匿名函数,是不能作为构造函数的,不能使用new
  • 箭头函数会捕获其所在上下文的 this 值,作为自己的 this 值
  • 箭头函数的this永远指向其上下文的 this,任何方法都改变不了其指向

img

this 转移

将指向vue对象的this赋值给外部方法定义的属性,然后在内部方法中使用该属性

img

猜你喜欢

转载自blog.csdn.net/weixin_43201015/article/details/83352899