javascript - 删除 Pixi 应用程序中所有 child 的 child

Question

我正在尝试删除 pixi 应用程序中 childen 的所有子项，但是一些 sprite 项目仍然存在并且在 tween 之后失败。以下位于名为 appEntry 的类中。

create(){
    this.renderer = new Renderer({ resolution: window.devicePixelRatio });
    this.renderer.backgroundColor = 0x260244;

    this.app = new Container(); 
    this.loader = new Loader(); 

    console.log('PIXI APP INIT!');

    document.getElementById('pixi-render').appendChild(this.renderer.view);
    console.log('RENDERER APPENDED:', this.renderer);
    console.log('PIXI APP APPENDED:', this.app);

    AnimationStore.subscribe(() => {
       this.renderer.render(this.app);
    });

    Store.subscribe(() => {
       const { color, coloron } = Store.getState().App;
    });

    const main = new Main();
    this.app.removeChild(this.loader);
    this.app.addChild(main); 
    this.renderer.start();
}

destroy(){
    this.app.destroy(true);
    this.app = null;

    this.renderer.view.destroy( true );
    this.renderer.view = null;

    while(this.app.children[0]) { 
    this.app.removeChild(this.app.children[0]); }

    this.renderer.destroy( true );
    this.renderer = null;
    console.log('PIXI APP APPENDED:', this.app);
}

Answer 1

似乎 destroy 方法设计不正确，并且不清楚为什么在执行时浏览器中没有错误:this.app 变量在从中删除所有子项之前被取消 while(this.app.children[0])

一开始，我建议接下来改变方法:

destroy(){
    while(this.app.children[0]) { 
        this.app.removeChild(this.app.children[0]);
    }

    this.app.destroy(true);
    this.app = null;

    this.renderer.view.destroy( true );
    this.renderer.view = null;

    this.renderer.destroy( true );
    this.renderer = null;
    console.log('PIXI APP APPENDED:', this.app);
}

此外，请确保您的错误与补间仍然处于事件状态这一事实无关，但它们的补间目标已经无效/删除/销毁。如果是这种情况，那么除了删除视觉对象之外，您还需要停止/销毁所有补间。