vue 绑定数据失败

122 阅读1分钟

背景

原本想把后台返回的数据展示出来,反复测试后发现绑定失败

image.png

解决策略

在Vue的methods中的submitForm方法中,使用了axios库进行了异步请求,然后在.then函数中对返回的结果进行处理,并将结果赋值给this.tip。然而,在.then函数中,this的指向会发生变化,不再指向Vue实例,而是指向被调用者,因此无法正确地设置this.tip。

为解决这个问题,你可以在调用.then函数之前,将Vue实例的this保存到一个变量中,然后在.then函数中使用该变量来设置this.tip。可以通过使用箭头函数来实现这一点,因为箭头函数的this不会被改变。

image.png