删除 Pixi 应用中 children 的所有 children

Question

我正在尝试删除 pixi 应用程序中的所有 children 个孩子，但是一些精灵项目仍然存在并且在补间后失败。以下位于标题为 class 的 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 variable is nullified在从中删除所有 children 之前 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);
}

此外，请确保您的错误与补间动画仍然处于活动状态这一事实无关，但它们的 tween-targets 已经 nullified/removed/destroyed。如果是这种情况，那么除了删除视觉 objects 之外，您还需要 stop/destroy 所有补间。

删除 Pixi 应用中 children 的所有 children

Remove all children of children in Pixi Application

javascript

pixi.js