Vue回调方法内获取不到当前组件this元素的解决方案
在使用事件订阅$on或者使用axios请求数据时,在回调方法内想刷新数据或者调用其他本组件的方法,发现调用不了,this不能指向当前组件的vue实例,提示TypeError: this.xxx is not a function或者其他。解决方法:使用=>示例//修改前globalBus.$on("test.order.new",function(data){//打印获取的数...
·
在使用事件订阅$on或者使用axios请求数据时,在回调方法内想刷新数据或者调用其他本组件的方法,发现调用不了,this不能指向当前组件的vue实例,提示TypeError: this.xxx is not a function或者其他。
解决方法:使用=>
- 示例
//修改前
globalBus.$on("test.order.new",function(data){
//打印获取的数据
consolo.log(data);
//调用本组件的其他方法,例如刷新数据 **失败,this指向错误
this.update(data);
});
//修改后
globalBus.$on("test.order.new",(data) => {
//打印获取的数据
consolo.log(data);
//调用本组件的其他方法,例如刷新数据 **成功,this指向当前vue实例
this.update(data);
});
=>和function()匿名函数不同。
function匿名函数this指向运行时实际调用该方法的对象。
=>没有自己的this,这里this在编写时已经确定。优点是不会愁于找当前组件的方法,缺点是箭头函数不能用作构造器,和 new一起用会抛出错误。
更多推荐
已为社区贡献7条内容
所有评论(0)