0

在 PreloadJS 的回调函数中，我失去了作用域。尝试过不同的方法，例如箭头函数（在最高级别上无效等......有什么提示吗？（对不起，格式错误的代码块（类定义等），仍然习惯这个编辑器，相信我，所有正在工作的代码）...

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'));
    }       

}
4

1 回答 1

0

好的，5分钟后更新....

添加了一个箭头函数作为变量并将其传递给事件侦听器。这不是我的首选方式，但它确实有效......

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
}

也许这可以帮助任何人。

仍然有兴趣看看是否有更好的方法......

于 2016-12-30T13:27:09.780 回答