对于 ExtJS 6.5+ Modern,如何将点击事件添加到组件,以便您可以在视图控制器中访问它。
下面的例子不起作用。我还尝试将侦听器直接添加到子元素。
示例模板:
Ext.define('TestController', {
extend: 'Ext.app.ViewController',
alias: 'controller.test-controller',
control: {
'[reference=someComponent]': {
click: 'someComponentClick'
}
},
someComponentClick: function() {
console.log('it worked!')
}
})
Ext.define('TestContainer', {
extend: 'Ext.Container',
xtype: 'test-container',
controller: 'test-controller',
items: [
{
xtype: 'component',
reference: 'someComponent'
html: 'CLICK HERE TO TEST'
}
]
})
更新
根据 priyadarshi 的回答,以下元素调用控制器中的函数。但是,我宁愿通过仅收听单击事件来在控制器中正常拾取事件。无论如何,是否可以将事件侦听器从控制器附加到 dom,或者至少从元素中触发一个事件,以便您可以在控制器中获取它(没有它显式调用控制器上的函数)。
Ext.define('TestController', {
extend: 'Ext.app.ViewController',
alias: 'controller.test-controller',
control: {
'[reference=someComponent]': {
click: 'someComponentClick'
}
},
someComponentClick: function() {
console.log('it worked!')
},
someFuncOnController: function() {
console.log('someFuncOnController') // << This runs
}
})
Ext.define('TestContainer', {
extend: 'Ext.Container',
xtype: 'test-container',
controller: 'test-controller',
items: [
{
xtype: 'component',
reference: 'someComponent'
html: 'CLICK HERE TO TEST',
listeners: [
element: 'element',
click: 'someFuncOnController'
]
}
]
})