Javascript 如何从表单Extjs 6.0.2获取DisplayField的值？

我正在尝试使用this.up（'form'）.getValues（）从表单获取dispalyfield的值。但我得到的是一个空的物体

有人能帮我吗？Extjs版本6.0.2

下面是我尝试的示例代码：

Ext.create('Ext.form.Panel', {
    renderTo: Ext.getBody(),
    width: 175,
    height: 150,
    bodyPadding: 10,
    title: 'Final Score',
    items: [{
        xtype: 'displayfield',
        fieldLabel: 'Home',
        name: 'home_score',
        value: '10'
    }, {
        xtype: 'displayfield',
        fieldLabel: 'Visitor',
        name: 'visitor_score',
        value: '11'
    }],
    buttons: [{
        text: 'Update',
        handler: function (button, e) {
            var form = this.up('form');
            var values = form.getValues();

            Ext.log({
                msg: "values: ",
                values
            });

            Ext.log({
                msg: "Home: " + values.home_score
            });

            Ext.log({
                msg: "Visitor: " + values.visitor_score
            });

        }
    }]
});

注意：显示字段--Ext.getCmp（“someID”）.getValue（）我尝试了获取值。但是我想从没有getCmp和ID的表单中获取并设置dispalyfield的值。

为此，您需要使用它，它将返回

Ext.form.Basic

表单。现在，您需要使用获取值和设置字段值

在这个中，我使用上述方法创建了一个演示

代码片段

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.form.Panel', {
            renderTo: Ext.getBody(),
            width: 175,
            height: 150,
            bodyPadding: 10,
            title: 'Final Score',
            items: [{
                xtype: 'displayfield',
                fieldLabel: 'Home',
                name: 'home_score',
                value: '10'
            }, {
                xtype: 'displayfield',
                fieldLabel: 'Visitor',
                name: 'visitor_score',
                value: '11'
            }],
            buttons: [{
                text: 'Update',
                handler: function (button, e) {
                    var form = this.up('form').getForm(),
                        values = form.getFieldValues();

                    Ext.log({
                        msg: "values: " + Ext.encode(values)
                    });

                    Ext.log({
                        msg: "Home: " + values.home_score
                    });

                    Ext.log({
                        msg: "Visitor: " + values.visitor_score
                    });

                    form.setValues({
                        home_score: 100,
                        visitor_score: 111
                    });
                }
            }]
        });
    }
});

为此，您需要使用它，它将返回

Ext.form.Basic

表单。现在，您需要使用获取值和设置字段值

在这个中，我使用上述方法创建了一个演示

代码片段

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.form.Panel', {
            renderTo: Ext.getBody(),
            width: 175,
            height: 150,
            bodyPadding: 10,
            title: 'Final Score',
            items: [{
                xtype: 'displayfield',
                fieldLabel: 'Home',
                name: 'home_score',
                value: '10'
            }, {
                xtype: 'displayfield',
                fieldLabel: 'Visitor',
                name: 'visitor_score',
                value: '11'
            }],
            buttons: [{
                text: 'Update',
                handler: function (button, e) {
                    var form = this.up('form').getForm(),
                        values = form.getFieldValues();

                    Ext.log({
                        msg: "values: " + Ext.encode(values)
                    });

                    Ext.log({
                        msg: "Home: " + values.home_score
                    });

                    Ext.log({
                        msg: "Visitor: " + values.visitor_score
                    });

                    form.setValues({
                        home_score: 100,
                        visitor_score: 111
                    });
                }
            }]
        });
    }
});

---

您如何设置该值？值永远不会改变，所以从那里获取。@Evan您可以看到displayfield，我在创建fieldYep时设置值，这就是我的观点。是的，但是form.getValues（）返回的值对象是“textfield”，而不是“displayfield”。如果我将xtype更改为“textfield”，我将获得该值。但我希望该字段为displayfield.Docs：“一个仅显示的文本字段，未经验证且未提交。当您希望显示表单加载数据中的值，但不希望用户编辑或提交该值时，此字段非常有用。”Link（开头）：您如何设置该值？值永远不会改变，所以从那里获取。@Evan您可以看到displayfield，我在创建fieldYep时设置值，这就是我的观点。是的，但是form.getValues（）返回的值对象是“textfield”，而不是“displayfield”。如果我将xtype更改为“textfield”，我将获得该值。但我希望该字段为displayfield.Docs：“一个仅显示的文本字段，未经验证且未提交。当您希望显示表单加载数据中的值，但不希望允许用户编辑或提交该值时，此字段非常有用。”链接（开头）：