失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > vue 执行函数this_vue回调函数中this无效

vue 执行函数this_vue回调函数中this无效

时间:2020-05-11 19:19:06

相关推荐

vue 执行函数this_vue回调函数中this无效

在vue中使用回调函数,发现函数体中使用this无效,无法调到methods里面定义的getCurrentExtent()函数。

handler.setInputAction(function(wheelment) {

var extent = this.getCurrentExtent(viewer);

console.dir(extent);

}, Cesium.ScreenSpaceEventType.WHEEL);

回调函数的内部的this并非指向当前的vue实例;如果要使用,用在外部函数定义的变量存储的this,也就是当前vue的实例。

var _this = this;

handler.setInputAction(function(wheelment) {

var extent = _this.getCurrentExtent(viewer);

console.dir(extent);

}, Cesium.ScreenSpaceEventType.WHEEL);

也可改为箭头函数来实现

handler.setInputAction(wheelment => {

var extent = this.getCurrentExtent(viewer);

console.dir(extent);

}, Cesium.ScreenSpaceEventType.WHEEL);

箭头函数和匿名函数有个明显的区别:箭头函数内部的this是词法作用域,由上下文确定。此时this在箭头函数中已经按照词法作用域绑定了。很明显,使用箭头函数之后,箭头函数指向的函数内部的this已经绑定了外部的vue实例了.

如果觉得《vue 执行函数this_vue回调函数中this无效》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。