Extjs如何在组件中创建getter / setter

时间:2012-07-24 03:37:02

标签: javascript extjs

我有一个代码,我在其中创建了一个组件。点击申请我要保存此表格字段对象并使其可用于获取。这样父容器就可以读取它。

我还想要所有字段getter / setter,以便更新值运行时。怎么做到这一点?

Ext.define('MyApp.view.MyForm', {
    extend: 'Ext.form.Panel',

    height: 463,
    width: 227,
    bodyPadding: 10,
    title: 'My Form',

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'textfield',
                    fieldLabel: 'Component Name',
                    anchor: '100%'
                },
                {
                    xtype: 'textfield',
                    fieldLabel: 'Host',
                    anchor: '100%'
                },
                {
                    xtype: 'textfield',
                    fieldLabel: 'Port',
                    anchor: '100%'
                },
                {
                    xtype: 'textfield',
                    fieldLabel: 'Path',
                    anchor: '100%'
                },
                {
                    xtype: 'textareafield',
                    fieldLabel: 'Request Data',
                    anchor: '100%'
                },
                {
                    xtype: 'button',
                    text: 'Apply',
                    listeners: {
                        click: {
                            fn: me.onButtonClick,
                            scope: me
                        }
                    }
                }
            ]
        });

        me.callParent(arguments);
    },
        onButtonClick: function(button, e, options) {
                   var form = this.getForm(),
            values = form.getFieldValues(),
                    //make this available to public
            json = Ext.JSON.encode(values);
            console.log(json);


    }

});

2 个答案:

答案 0 :(得分:3)

为了实现这个需要在config中定义所有变量:{} extjs将自动创建getter / setter。

然后,您可以使用this.getVar(),this.setVar()

来引用它

我希望这对初学者有用。

答案 1 :(得分:3)

有关详细信息,请参阅http://docs.sencha.com/ext-js/4-0/#!/guide/class_system的配置部分