Events throw error in PixiJs version 7.2.0 after the example

Question

我是第一次尝试 PixiJs，当我尝试拖动示例时 (https://pixijs.io/examples/#/events/dragging.js) 我得到了一堆关于事件的错误:

我正在 Vue 3 项目中对其进行测试，因为这是我最终想要实现它的地方。

我尝试将

bunny.interactive = true;

替换为

img.eventMode = 'static'

但它给了我同样的错误，但至少 PixiJs 警告消失了。

我怎么称呼开始事件

img.on('pointerdown', this.onDragStart, img);

其他活动：

this.app.stage.on('pointerup', this.onDragEnd);
this.app.stage.on('pointerupoutside', this.onDragEnd);

当我按照示例页面上的描述操作时，为什么会出现这些错误？也许我只是缺少一些简单的东西，但我无法弄清楚。

提前致谢。

更新：

这样做：

img.on('pointerdown', (event) => { console.log("test") });

给出了同样的错误，所以问题不是我调用的函数。

Answer 1

这是一个 vue 问题。

我在数据函数中创建了一个 pixi 应用程序，然后将其分配给具有实际配置的新 pixi 应用程序。

它不喜欢。所以我从数据函数中删除了它，只使用了一个 const，现在它可以工作了！

Answer 2

我在 vue3 中遇到了这个问题你可以创建一个 emample 来帮助 谢谢你

const canvasRef = ref(null);
const app = ref(null);
const process = ref(0);

onMounted(() => {
  const options: PIXI.IApplicationOption = {
    backgroundColor: '#00000000',
    width: canvasRef.value.offsetWidth,
    height: canvasRef.value.offsetHeight,
    transparent: true,
    autoResize: true,
  };
  app.value = new PIXI.Application(options);
  app.value.stage.eventMode = 'static';
  canvasRef.value.appendChild(app.value.view);
  PixiInit();
});
function PixiInit() {
  const ary = [];
  Object.keys(gameConfig).forEach((key) => {
    gameConfig[key].map((item) => {
      PIXI.Assets.add(item.name, item.url);
      ary.push(item.name);
    });
  });
  PIXI.Assets.load(ary, (processVal) => {
    process.value = Math.floor(processVal * 100);
  }).then(() => {
    const soundSprite = new PIXI.Sprite(PIXI.Assets.get('sound_of.png'));
    soundSprite.position.set(825, 50);
    soundSprite.anchor.set(0.5);
    soundSprite.cursor = 'pointer';
    soundSprite.eventMode = 'static';
    soundSprite.on('click', (event) => {
      console.log(123);
    });
    app.value.stage.addChild(soundSprite);
  });
}
});