如何使用ExtJS Panel渲染器配置添加点击事件？

Question

现在，在配置渲染器中，我无法调用tClick；有什么办法可以满足我的需求？

代码是：

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.panel.Panel', {
            title: 'Table Layout',
            width: 300,
            layout: 'form',
            items: [{
                xtype: 'displayfield',
                fieldLabel: 'Home',
                name: 'home_score',
                renderer: function (val) {
                    return "<button onclick='this.tClick;'>test</button>";
                }
            }],
            buttons: [{
                text: 'Upload',
                handler: this.tClick
            }],
            renderTo: Ext.getBody()
        });
    },

    tClick: function () {
        alert(1);
    },
});

在此处查看运行结果：https://fiddle.sencha.com/#view/editor

Answer 1

您应该引用Fiddle.getApplication().tClick()之类的应用程序。

Ext.application({
    name: 'Fiddle',

    launch: function () {
        let me =this;
        Ext.create('Ext.panel.Panel', {
            title: 'Table Layout',
            width: 300,
            layout: 'form',
            items: [{
                xtype: 'displayfield',
                fieldLabel: 'Home',
                name: 'home_score',
                renderer: function (val) {
                    return "<button onclick='Fiddle.getApplication().tClick();'>test</button>";
                }
            }],
            buttons: [{
                text: 'Upload',
                handler: this.tClick
            }],
            renderTo: Ext.getBody()
        });
    },

    tClick: function () {
        alert(1);
    },
});