Question

我是CQ5和ExtJS的新手。我创建了一个cq extjs小部件。现在我的widget js文件中有很多硬编码字符串。像fieldLabel，fieldDescription，addItemLabel，rootPath等...我希望将这个小部件传递给另一个团队但不希望他们在我的widget js脚本中进行任何更改，因为他们可能会犯错，因为他们完全不是技术人员。

我希望我可以通过读取全局变量中的值来创建另一个单独的js文件并声明一些全局变量并设置上述许多字段的值。

我会将这个单独的js文件命名为mywidgetconfig.js，并将请求其他团队仅根据他们的需要进行更改，并且仅在此文件中进行更改。

例如，在我的小部件中，我有硬编码 - ＆gt;

{
fieldLabel : 'Multi Field to setup links'
}

我希望我可以将此值保存在mywidgetconfig.js中：

INNERMULTIFIELD_FIELD_LABEL_TEXT_STRING : 'Multi Field to setup links',

等等

INNERMULTIFIELD_FIELD_DESC_TEXT_STRING : 'blah blah blah'

在我的实际小部件js中，我可以访问值 - ＆gt;

{
fieldLabel : MyNamespace.INNERMULTIFIELD_FIELD_LABEL_TEXT_STRING,
fieldDescription: MyNamespace.INNERMULTIFIELD_FIELD_DESC_TEXT_STRING
}

这可能吗？

Answer 1

是的，有可能。您可以在命名空间中创建变量，然后创建一个新的js文件（mywidgetconfig.js，如您所愿），它只包含您希望新团队更改的配置。

例如，您可以拥有自定义窗口小部件（customwidget.js），如下所示，它定义了命名空间中的变量

/**
 * @class Myns.CustomWidget
 * @extends CQ.form.CompositeField
 * This is a custom widget based on {@link CQ.form.CompositeField}.
 * @constructor
 * Creates a new CustomWidget.
 * @param {Object} config The config object
 */
var Myns = {};
Myns.CustomWidget = CQ.Ext.extend(CQ.form.CompositeField, {

    hiddenField: null,
    /**
     * @private
     * @type CQ.Ext.form.TextField
     */
    textf: null,
    /**
     * @private
     * @type CQ.Ext.form.NumberField
     */
    numberf: null,

    constructor: function(config) {
        config = config || { };
        var defaults = {
            "border": true,
            "layout": "form"
        };
        config = CQ.Util.applyDefaults(config, defaults);
        Myns.CustomWidget.superclass.constructor.call(this, config);
    },


    // overriding CQ.Ext.Component#initComponent
    initComponent: function() {
        Myns.CustomWidget.superclass.initComponent.call(this);

        this.hiddenField = new CQ.Ext.form.Hidden({
            name: this.name
        });
        this.add(this.hiddenField);

        this.textf = new CQ.Ext.form.TextField({
            fieldLabel: Myns.TEXTFIELDLABEL, //using variable
            allowBlank: false
        });
        this.add(this.textf);

        this.numberf = new CQ.Ext.form.NumberField({
            fieldLabel: Myns.NUMBERFIELDLABEL, //using variable
            allowBlank: false
        });
        this.add(this.numberf);
    }
    // rest of the code goes here
});
Myns.TEXTFIELDLABEL = "Enter Text"; //defining variable
Myns.NUMBERFIELDLABEL = "Enter a number"; //defining variable
// register xtype 
CQ.Ext.reg('customwidget', Myns.CustomWidget);

你的mywidgetconfig.js将包含那些可被其他人修改的变量。

/*
* Field Label for the text field
*/
Myns.TEXTFIELDLABEL = "New Text"; 

/*
* Field label for number field
*/
Myns.NUMBERFIELDLABEL = "New number";

在你的js.txt中，确保在customwidget.js下添加mywidgetconfig.js

#base=js
customwidget.js
mywidgetconfig.js

CQ5自定义窗口小部件开发 - 将我的硬编码值保存在窗口小部件脚本之外 - 使用全局变量

1 个答案: