使用 PIXI JS 在 vue js 方法上绑定上下文

Question

是否可以在方法上绑定上下文？我做了一个像素图：

var square = new PIXI.Graphics();

然后我调用我的方法 this.onDragMove 并绑定 square。

square
    .on('pointermove', this.onDragMove.bind(square));

但是当我登录时 this 它仍然会登录 vue 组件。

onDragMove() {
    console.log(this);
    console.log('Object is moving')
},

我是做错了什么还是不可能的？

Answer 1

根据 docs:

All methods will have their this context automatically bound to the Vue instance.

您不能重新绑定在 Vue 实例上定义的方法的 this 上下文，原因与以下代码无法按预期工作的原因相同：

function foo() {
  return this;
}

const X = {};
const Y = {};

const fooX = foo.bind(X);
const fooY = fooX.bind(Y);  // Attempting to bind an already bound function

console.log(fooX() === X);  // true
console.log(fooY() === X);  // true
console.log(fooY() === Y);  // false

您可以通过$options访问原始未绑定函数：

square
    .on('pointermove', this.$options.methods.onDragMove.bind(square));

使用 PIXI JS 在 vue js 方法上绑定上下文

Bind context on vue js method with PIXI JS

javascript

vue.js

pixi.js