commonjs中的addEventListener

Question

I need your help on this. Lets say I have 2 files.

file1

function test(){
   this.view= Ti.UI.createView({
            backgroundColor : 'white'
    });
}
module.exports = test;

and in file 2

 var view = Ti.UI.createView();
 var a = require('file1');

 a = new test();
 view.add(a.view);
 //no problem

And now I want to add eventListeners to the view.

file2

 var view = Ti.UI.createView();
 var a = require('file1');
 a=new test();
 view.add(a.view);

 a.view.addEventListener('click',function(){
      a.view.backgroundColor = 'red';
 });

//no problem with this too

But is there a way to add eventlisteners to view in file 1? something like this

file1

 function test(){
     this.view = Ti.UI.createView({
           backgroundColor : 'white'
     });

     this.view.addEventListener('click',function(){
              this.view.backgroundColor = 'red';
     });
 }

Doing this will give me the following error

 Uncaught TypeError: Cannot set property 'backgroundColor' of undefined

Answer 1

The event listener is related with the view and with the test function. So when you do:

this.view.addEventListener('click',function(){
          this.view.backgroundColor = 'red';
 });

You are trying to access the backgroundColor inside the view inside the this.view .

Capture the outside scope before you append the event and use it when execute the click:

function test(){
     var _this = this;

     this.view = Ti.UI.createView({
         backgroundColor : 'white'
     });

     this.view.addEventListener('click',function(){
         _this.view.backgroundColor = 'red';
     });
 }

This should give you the correct reference you are expecting.