2016-11-06 2 views
0

구성 요소 I에서 PIXI.js 캔버스 요소를 didInsertElement으로 설정합니다. 내가 다른 경로로 전환 할 때 나중에 엠버이 오류가 발생합니다 :Ember view.renderer.willDestroyElement는 구성 요소에서 다른 경로로 전환 할 때 함수가 아닙니다.

Uncaught TypeError: view.renderer.willDestroyElement is not a function(…)

새로운 경로는 modelsetupController 후크가 호출되는으로로드 것으로 나타나고 새로운 경로의 URL 변경됩니다. 그러나 이전 구성 요소가 여전히로드되어 있고 새 경로 DOM 요소가 없습니다. 또한 willDestroyElement은 이전 구성 요소에서 호출되지 않습니다.

나는 "엠버 - CLI"사용하고 있습니다 : "2.9.1"

코드로 업데이트 : 구성 요소에서

{{game-puzzle gameType='puzzle'}}

:이

didInsertElement() { 
    const $gameCanvas = $('#game-canvas').get(0); 

    this.set('$gameCanvas', $gameCanvas); 

    this.setupCanvas(); 
    this.setupHud(); 
    this.setupPiecesArray(); 
    this.loadImages(); 
}, 

setupCanvas() { 
    console.log('@setupCanvas'); 

    const width = this.get('screenPixelWidth'); 
    const height = this.get('screenPixelHeight'); 
    const $gameCanvas = this.get('$gameCanvas'); 

    // Use autoDetectRenderer to choose the best available renderer 
    // either: WebGL or canvas 
    let renderer = PIXI.autoDetectRenderer(width, height, { 
     view: $gameCanvas, 
     backgroundColor: 0x000000 
    }); 

    let stage = new PIXI.Container(); 
    let container = new PIXI.Container(); 

    this.set('renderer', renderer); 
    this.set('stage', stage); 
    this.set('container', container); 
    }, 

업데이트 및 렌더링에 requestAnimationFrame을 사용하는 gameLoop 메서드입니다 ...하지만 나는 그들이 여기에 도움이 될 것이라고 생각하지 않습니다.

캔버스가 초기화 된 상태에서 경로가 제대로 전환되면 문제가 발생하는 것 같습니다. 그러나 분명히 좋지 않다! PIXI 캔버스 설정과 관련이 있다고 생각하게 만듭니다. 좋아

+0

관련 코드를 공유 할 수 있습니까? – saygun

+0

질문이 코드 스 니펫으로 업데이트되었습니다. – mrlion

+0

'init' 메소드를 오버라이드하고'this._super (... arguments)'를 호출하는 것을 잊어 버렸습니까? – kumkanillam

답변

0

, 나는 내 Pixi.canvasRendererrenderer에 이름을 지정의 충돌을 실현, 수치심 시간에 머리 ... 약간의 분노 디버깅 후

을 누르고 있습니다.

Ember 컨테이너 렌더러 (renderer._dom)와 충돌합니다. 당신은 renderer 변수에 canvasRenderer를 저장 Pixi 또는에서 Phaser의 깎아 지른듯한 관례

은 (페이저는 렌더링 엔진으로 픽시를 사용하기 때문에보고).

renderercanvasRenderer으로 변경하면 물론 오류가 사라집니다.

const canvasRenderer = PIXI.autoDetectRenderer(width, height, { 
    view: $gameCanvas, 
    backgroundColor: 0xffffff 
}); 
관련 문제