Question

我正在尝试从自定义面板中读取属性，以便将其用于同一面板中的属性项。让我展示我的代码，这样你就可以理解我的意思了：

Ext.define('XXX.XXX.XXX.MyPanel', {
extend: 'Ext.panel.Panel',
title: 'My Panel',
autoScroll: true,
isMyProperty: false,
defaults: {
    margin: 4,
    xtype: 'horizontalfieldpanel'
},
items: [
    {
        title: 'SOme title',
        itemId: 'title1',
        items: [
            {
                xtype: 'textfield',
                name: 'name',
                fieldLabel: 'Name',
                allowBlank: !this.isMyProperty
            }, {
                xtype: 'textfield',
                name: 'lastName',
                fieldLabel: 'Last Name',
                allowBlank: !this.isMyProperty
            }, {

正如你所看到我有isMyProperty并且我试图在allowBlank上使用它，但它没有接受它。它取值为默认值。

知道我做错了吗？

谢谢，

Answer 1

传统方法是使用'config'子系统。这告诉它为你的类添加一个新的配置选项，它也为它生成一个getter / setter方法。

构建面板时，可以覆盖配置选项，就像基类中的任何其他配置选项一样。

一个诀窍是，您的items必须在initComponent方法中构建，而不是在类定义中进行构建。我发现在复杂的应用程序中，最好计划覆盖initComponent来创建items，而不是在大多数情况下使用“静态”项目声明。

Ext.define('XXX.XXX.XXX.MyPanel', {
    extend: 'Ext.panel.Panel',
    config: {
        isMyProperty: false
    },
    title: 'My Panel',
    autoScroll: true,
    defaults: {
        margin: 4,
        xtype: 'horizontalfieldpanel'
    },
    initComponent: function() {
        this.items = [{
            title: 'Some title',
            itemId: 'title1',
            items: [{
                xtype: 'textfield',
                name: 'name',
                fieldLabel: 'Name',
                allowBlank: !this.@getIsMyProperty()
            }, {
                xtype: 'textfield',
                name: 'lastName',
                fieldLabel: 'Last Name',
                allowBlank: !this.@getIsMyProperty()
            }, {
                ...
            }]
        }];

        this.callParent(arguments);
    }
});

要覆盖构造中的值：

var panel = Ext.create('XXX.XXXX.XXXX.MyPanel', {
 isMyProperty: true 
});

ExtJS - 从自定义面板读取属性

1 个答案: