В Extjs, как вызвать функцию в представлении с другого контроллера?

Question

Я пытаюсь заставить это работать в Sencha Fiddle. Проблема я столкнулся в том, что я получаю ошибку на этой линии

MyApp.app.getView('MyApp.view.test2').test(); 

При нажатии кнопки в текстовом поле, он терпит неудачу с ошибкой (в лог консоли) Uncaught TypeError: MyApp.app.getView (...) .test не является функцией

//Controller 
Ext.define('MyApp.controller.test', { 
    extend: 'Ext.app.ViewController', 
    alias: 'controller.test', 
    myVar:0, 
    init: function() { 
    } 
}); 

//View 
Ext.define('MyApp.view.test', { 
    extend: 'Ext.form.field.Text', 
    alias:'widget.test', 
    controller: 'test', 
    title: 'Hello', 
    listeners: { 
     focus: function(comp){ 
      MyApp.app.getView('MyApp.view.test2').test(); //Fails with an error that test is not a function      } 
    }, 
    renderTo: Ext.getBody() 
}); 

//View 
Ext.define('MyApp.view.test2', { 
    extend: 'Ext.form.Panel', 
    alias:'widget.test2', 
    title: 'Hello2',  
    renderTo: Ext.getBody(), 
    test:function() 
    { 
     alert('in MyApp.view.test2'); 
    } 
}); 

Ext.application({ 
    name: 'MyApp', 
    launch: function() { 
     Ext.create('MyApp.view.test'); 
     Ext.create('MyApp.view.test2'); 
    } 
}); 

Answer 1

getView() функция просто возвращает класс и не экземпляр зрения. См ExtJs 5.1.1 Controller.getView():

Returns a View class with the given name. To create an instance of the view, you can use it like it's used by Application to create the Viewport:

this.getView('Viewport').create();

Чтобы получить созданный экземпляр вида вы можете заархивировать его с Ext.ComponentQuery.

//query returns an array of matching components, we choose the one and only 
var test2View = Ext.ComponentQuery.query('test2')[0]; 
// and now we can execute the function 
test2View.test(); 

Просмотреть действующий минималистичный fiddle.

//View 
Ext.define('MyApp.view.test', { 
    extend: 'Ext.form.field.Text', 
    alias: 'widget.test', 
    title: 'Hello', 
    listeners: { 
     focus: function (comp) { 
      //query returns an array of matching components, we choose the one and only 
      var test2View = Ext.ComponentQuery.query('test2')[0]; 
      test2View.test(); 
      //MyApp.app.getView('MyApp.view.test2').test();//Fails with an error that test is not a function 
     } 
    }, 
    renderTo: Ext.getBody() 
}); 


//View 
Ext.define('MyApp.view.test2', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.test2', 
    title: 'Hello2', 
    renderTo: Ext.getBody(), 
    test: function() 
    { 
     alert('in MyApp.view.test2'); 
    } 
}); 


Ext.application({ 
    name: 'MyApp', 
    launch: function() { 
     Ext.create('MyApp.view.test'); 
     Ext.create('MyApp.view.test2'); 
    } 
});