如何在 ExtJs 网格中实现插件

Question

我想在 extjs 网格中实现一个插件，但它不渲染。

尝试使用以下代码但对我不起作用，控制台上没有错误。

Ext.define('xyz', {
extend: 'Ext.grid.Panel',
xtype: 'mytype',
requires: [
    'Store',
    'ServerFilterPlugin' // plugin
],
config: {
    filterView: 'displayfilterconfig'
},
plugins: [Ext.create('plugin.serverFilterPlugin')], //even tried with below way to implemet plugin but that is also not working
//plugins: [{
//  ptype: 'serverFilterPlugin',
//  orderIndex: 10,
//  filterView: 'displayfilterconfig'
//}],

插件：

Ext.define('ServerFilterPlugin', {
    extend: 'Ext.AbstractPlugin',
    alias: 'plugin.serverFilterPlugin',
    requires: [
        'DisplayToolbar',
        "StoreLoadMonitor"
    ],
    init: function (grid) {
        var me = this;

如何修复它，如何在插件的 init 中获取调试器？

Answer 1

在您的代码中，插件不会产生任何动作来检查它是否有效。这是网格的工作插件代码。它在网格中添加了一个工具栏。

Ext.define('ServerFilterPlugin', {
    extend: 'Ext.AbstractPlugin',
    alias: 'plugin.serverFilterPlugin',
    requires: [
    ],
    init: function (grid) {
        console.log('orderIndex: ', this.orderIndex);
        console.log('filterView: ', this.filterView);
        console.log('Number of rows: ', grid.getStore().getCount());
        this.addCustomToolbar();
    },

    addCustomToolbar: function() {
        this.getCmp().addDocked({
            xtype: 'toolbar',
            items: [{
                text: "Left Button"
            }, '->', {
                text: "Right Button"
            }]
        })
    }
});

Fiddle