2016-12-30 67 views
0

在PreloadJS的回調函數中,我正在失去範圍。已經嘗試過不同的方法,比如箭頭函數(這些函數在最高級別上是無效的......任何提示?(對於格式錯誤的代碼塊(class defenition等)抱歉,仍然習慣這個編輯器,相信我,全部正在代碼)...後ES6,預加載JS和範圍

import Navigation from './Navigation' 
import ajax from "./Ajax"; 
import Helper from "./Helper"; 

let preload = null; 

export default class Page{ 

    constructor(){ 
     this.preload = new createjs.LoadQueue(); 
     this.preload.addEventListener("fileprogress", this.handleFileProgress); 
     this.preload.addEventListener("fileload", this.handleFileComplete); 

    } 



    initPage(_arg = []){   
     this.buildPage(this.thePage); 
    } 


    buildPage(_content){ 
     this.loadImage(item.featured_image_thumbnail_url); 

    } 

    handleFileComplete(event){  

     console.log(event); 
     console.log(this); // undefined 

     let el = document.getElementById('heroImage'); 
     let loader = el.getElementsByClassName('loader')[0]; 
     this.showPage(); // cannot read property showPage of undefined 

    } 

    // small arrow test, doesn't seem valid 
    //handleFileComplete = (event) =>{ 
    // this.showPage(); 
    //} 

    handleFileProgress(event){  
     let hero = document.getElementById('heroImage') 
     let loader = hero.getElementsByClassName('loader')[0]; 
    } 

    loadImage(_img){  

     let el = document.getElementById('heroImage'); 
     let loader = el.getElementsByClassName('loader')[0]; 

     let loadManifest = [ 
      { 
      id: 'pat', 
      src: _img, 
      scope: this 
      }];  

     this.preload.loadManifest(loadManifest, true); 
    } 

    showPage(){ 
     //Helper.removeClass(document.getElementById('mytest','hidden')); 
    }  

} 

回答

0

確定,更新僅5分鐘....

Addded箭頭功能作爲一個變量和通過了到事件偵聽器。這不是我的優選但它確實工作,雖然...

constructor(){ 

    let handleFileCompleted = (event) => { 
     this.showPage(event) 
    }  

    this.preload = new createjs.LoadQueue(); 
    this.preload.addEventListener("fileprogress", this.handleFileProgress); 
    this.preload.addEventListener("fileload", handleFileCompleted); 
} 

showPage(event){ 
    console.log('I'm now reachable!'); 
    console.log(event); // fileload event 
} 

也許這可以幫助任何人。

仍然感興趣,看看有沒有更好的辦法,雖然...