javascript - Ext js 4.2 数据字段转换覆盖不起作用

Question

我正在尝试编写一个重写，它将在每个模型字段转换函数上调用。我试图确保每个字段都在没有 HTML 标签的情况下保存。如果我将代码放入单个转换函数中，它就可以工作。但覆盖似乎从未被调用过。

Ext.define('hds.override.data.Field', {
override: 'Ext.data.Field',
        constructor: function(config) {
    var me = this;
    this.convert = config.convert || function(v) {
        // Do something with v and return it
        console.log('Process value');
        v = Ext.util.Format.stripTags(Ext.util.Format.stripScripts(v));
        return v;
    };
    this.callParent(arguments);
}
});

Answer 1

您只需更改 this.callParent(arguments) 的顺序，如下例所示即可。

//Override data field
Ext.define('hds.override.data.Field', {
    override: 'Ext.data.Field',
    constructor: function (config) {
        var me = this;
        me.callParent(arguments);
        me.convert = config.convert || function (v) {
            // Do something with v and return it
            console.log('Process value');
            v = Ext.util.Format.stripTags(Ext.util.Format.stripScripts(v));
            return v;
        };
    }
});

在此FIDDLE ，我使用您的代码创建了一个演示。我希望这能帮助您或指导您解决问题。

代码片段

//Override data field
Ext.define('hds.override.data.Field', {
    override: 'Ext.data.Field',
    constructor: function (config) {
        var me = this;
        me.callParent(arguments);
        me.convert = config.convert || function (v) {
            // Do something with v and return it
            console.log(`Process value for ${v}`);
            v = Ext.util.Format.stripTags(Ext.util.Format.stripScripts(v));
            return v;
        };
    }
});

Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    fields: ['name', 'email', {
        name: 'phone',
        convert: function (v) {
            return `+91 ${v}`;
        }
    }],
    data: [{
        name: 'Lisa',
        email: 'lisa@simpsons.com',
        phone: '9898989898'
    }, {
        name: 'Bart',
        email: 'bart@simpsons.com',
        phone: '9898989898'
    }, {
        name: 'Homer',
        email: 'homer@simpsons.com',
        phone: '9898989898'
    }, {
        name: 'Marge',
        email: 'marge@simpsons.com',
        phone: '9898989898'
    }]
});

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [{
        text: 'Name',
        flex: 1,
        dataIndex: 'name'
    }, {
        text: 'Email',
        dataIndex: 'email',
        flex: 1
    }, {
        flex: 1,
        text: 'Phone',
        dataIndex: 'phone'
    }],
    renderTo: Ext.getBody()
});