在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实例了.