Question

我有一张表格。其中有很多textfields。我使用allowBlank属性不允许用户将字段留空并blankText来定义自定义“空白错误”文本。

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "Surname" field',                  
},

我的问题是：

有没有办法在同一个对象的另一个属性中使用Ext.form.field.Text的对象属性？

类似的东西：

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "' + fieldLabel + '" field',                  
},

（不起作用）

或：

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "' + this.fieldLabel + '" field',                  
},

（也不起作用）

更新

例如，在minLengthText属性中，我可以使用模板驱动的文本，例如“此字段的最小长度为{0}”，它取同一对象的minLength属性值。

我再说一遍：我使用ExtJS的对象初始化方法，其对象文字语法如下：

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "Surname" field',                  
},

这种语法很整洁，在这里不欢迎使用其他语法。

Answer 1

您需要创建对象，获取对象的引用，然后通过其引用对其进行扩充。

var obj = {
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false
};

obj.blankText = 'Please fill "' + obj.fieldLabel + '" field';

Answer 2

如果您不想重写代码，请尝试向您的表单添加监听器

示例

listeners : {

               render : function(){
                   Ext.each(form.items.items,function(fld,idx){
                    if(fld.getXType()=='textfield'){
                       fld.blankText = fld.fieldLabel;
                    }
                   });
               }
 }

Answer 3

一些替代方案：

1）这个优于接受的答案，因为渲染侦听器是修改DOM相关对象属性的不好的地方。它与渲染周期的工作方式有关，但它之前的效果要好得多，之后做得很好，之后做得差。下面的内容可能仅适用于处理平面字段列表的情况。

Ext.define('MyClass', {

    initComponent: function(){
        var fields = [{
            xtype: 'textfield',
            fieldLabel: 'Field 1'
        }, {
            xtype: 'textfield',
            fieldLabel: 'Field 2'
        }];

        Ext.Array.forEach(fields, function(field){
            field.blankText = 'Foo ' + field.fieldLabel
        });
        this.items = fields;
        this.callParent();
    }

});

2）在定义字段后，这样可以最大程度地控制您：

Ext.define('MyClass', {

    initComponent: function(){
        var wrap = this.wrap;

        this.items = [wrap({
            xtype: 'textfield',
            fieldLabel: 'Field 1'
        }), wrap({
            xtype: 'textfield',
            fieldLabel: 'Field 2'
        })];

        this.callParent();
    },

    wrap: function(config){
        config.blankText = 'Foo ' + config.fieldLabel;
        return config;
    }

});

Answer 4

我唯一能想到的是

new function(){
    this.xtype = 'textfield';
    this.fieldLabel = 'Surname';
    this.name = 'person_surname';
    this.allowBlank = false;
    this.blankText = 'Please fill "' + this.fieldLabel + '" field';                  
}

Answer 5

当你尝试做这些事情时，你有三个选择，真的：

var Object_1 = {};
Object_1.property_1 = "Something";
Object_1.property_2 = "I'm Really " + Object_1.property_1 + "!";


var Object_2 = {
    property_1 : "Something",
    property_2 : "I'm Really"
};

Object_2.property_2 += Object_2.property_1 + "!";


var Object_3 = (function () {
    var property1 = "Something",
        property2 = "I'm Really " + property1 + "!";

    return { property_1 : property1, property_2 : property2 };
}());

就用户定义的属性而言，这三个对象中的每一个最终都是等效的。就个人而言，我在JavaScript中使用＃3非常多，明确地避免了你现在遇到的问题。

将属性和方法定义为函数中的变量，然后返回一个可以访问这些原始变量的函数，或者返回一个对象（可以将方法附加到 - 只要方法是在原始函数 - 可以访问内部变量。）

Answer 6

你怎么写一个简单的解析器？

{
    xtype: 'textfield',
    fieldLabel: 'Surname',
    name: 'person_surname',
    allowBlank: false,
    blankText: 'Please fill [fieldlabel] field',                  
},

输出消息时，请将宏[fieldlabel]替换为对象的.fieldLabel值。为其他可能需要的东西添加其他宏。

Answer 7

如果您的代码在支持ECMAScript 5 Getters and Setters功能的浏览器中运行，您可以使用getter来实现您的需求：

{
    xtype: 'textfield',
    fieldLabel: 'Surname',
    name: 'person_surname',
    allowBlank: false,
    get blankText(){ return 'Please fill "' + this.fieldLabel + '" field';}
},

Answer 8

您可以执行以下操作：

({
    xtype: 'textfield',
    fieldLabel: 'Surname',
    name: 'person_surname',
    allowBlank: false,
    init: function() {
        this.blankText = `Please fill ${this.fieldLabel} field`;
        ...
        delete this.init;
        return this;
    }
}).init()

如何在初始化期间引用同一对象内的对象字段？

8 个答案: