从动态创建的表单访问ViewController中的函数
Accessing functions in ViewController from form created on-the-fly
视图控制器将是活动的,但它将控制许多其他视图的一个子视图,所以我认为将会有其他活动视图控制器。
通过on-the-fly基本上,表单是由一个完全不同的调度程序创建的,带有组件和处理程序等,视图控制器和表单之间没有直接连接。
视图控制器有几个功能,我需要从:
canContinue: function (arg1) {var result = true; /*...*/ return result;}
getStatus: function (arg1, arg2) {var result = 0; /* ... */ return result;}
/*...*/
表示省略代码。我想要访问视图控制器和这些功能。下面的内容:
var controller = /* how to get it? */;
if (!controller.canContinue(p))
alert(controller.status(q, r));
我读到不建议以这种方式直接访问函数,所以尝试了触发事件,但我似乎无法得到我需要的结果。
我想我可以给视图控制器一个itemId
,并做Ext.ComponentQuery.query('#itemId')
,但它似乎不起作用。我猜视图控制器不是一个组件,有意义。
视图控制器有一个唯一的类和别名,如果有帮助的话,一次将只有一个视图控制器是活动的。
我可能错过了一些非常简单的东西。欢迎任何帮助。
我不太清楚你的问题。我的理解是:你们有不同的观点,两者之间没有直接的联系。但你想要到达其他视图的控制器。如果有,请查看此页面:https://fiddle.sencha.com/#fiddle/urg
否则,我希望你准备一个小提琴,它显示你的问题。
Ext.define('FirstPanel', {
extend: 'Ext.panel.Panel',
controller: 'FirstPanelController',
layout: 'fit',
itemId: 'firstPanel',
items: [{
xtype: 'button',
text: 'FirstPanel Button',
handler: 'FirstButtonClick'
}]
});
Ext.define('FirstPanelController', {
extend: 'Ext.app.ViewController',
alias: 'controller.FirstPanelController',
FirstButtonClick: function(button) {
var me = this;
var SecondPanelController = me.getView().mainView.down('#secondPanel').getController();
SecondPanelController.FirstButtonClick();
console.log('FirstButton Click');
},
SecondButtonClick: function() {
alert('You are in FirstPanelController');
},
init: function() {
var me = this;
}
});
Ext.define('SecondPanelController', {
extend: 'Ext.app.ViewController',
alias: 'controller.SecondPanelController',
SecondButtonClick: function(button) {
var me = this;
var FirstPanelController = me.getView().up().down('#firstPanel').getController();
FirstPanelController.SecondButtonClick();
console.log('SecondPanelController');
},
FirstButtonClick: function() {
alert('You are in SecondPanelController');
},
init: function() {
var me = this;
}
});
Ext.define('SecondPanel', {
extend: 'Ext.panel.Panel',
controller: 'SecondPanelController',
layout: 'fit',
itemId: 'secondPanel',
items: [{
xtype: 'button',
text: 'SecondPanel Button',
handler: 'SecondButtonClick'
}]
});
Ext.define('MainPanel', {
extend: 'Ext.panel.Panel',
initComponent: function() {
var me = this;
me.items = [
Ext.create('FirstPanel', {
mainView: me
}),
Ext.create('SecondPanel')
]
me.callParent();
}
});