只能启动一次的 DOJO 小部件的最佳命名约定是什么?

What is a best practice naming convention for DOJO widgets that can be initiated only once?

我已经使用 PascalCase 表示法 (CustomPanel.js)

为我的 DOJO 应用程序定义了一个自定义小部件

在我的应用程序中,我通常对小部件使用 PascalCase 表示法,这些小部件可以在应用程序的多个点启动,并且可以同时存在更多 CustomPanel 类型的对象。

在我下面的具体示例中,我需要为自定义小部件 PanelCustomer.js 创建一个 class。这个特定的小部件可以在整个应用程序中独占只启动一次

我想听听您的意见:


  define([
        'app/_Panel',
        'dojo/_base/declare',
        'dijit/_WidgetBase',
        'dijit/_TemplatedMixin',
        'dojo/text!./templates/PanelCustomer.html',
        'dojo/topic'
    ], function (
        _Panel,
        declare,
        _WidgetBase,
        _TemplatedMixin,
        template,
        topic
        ) {
        return declare([_WidgetBase, _TemplatedMixin, _Panel], {
            templateString: template,
            appType: 'PanelCustomer',
            id: 'panelCustomer',
            title: 'Customer',
            postCreate: function () {
                this.inherited(arguments);
                this._render();
            },
            _render: function () {
                this._addBtn = new Button({
                    id: 'addBtn',
                    label: 'Add',
                    onClick: function () {

                    }.bind(this)
                }, 'addBtn');
            }
        });
    });

就个人而言,我会为小部件名称使用 PascalCase,因为它们将用作构造函数,而为您的函数使用 camelCase。大多数 javascript 库也遵循此约定,这就是我推荐它的原因。

我现在想不出为什么 Widget 应该是单例的原因,但最终它真的取决于您要对您的应用程序做什么。

在您的情况下,您是尝试为整个应用程序实例化 PanelCustomer 一次还是为每个客户实例化一次?从你命名它的方式来看,它听起来应该是每个客户一次。

如果您确实想创建一个单例,您所要做的就是在返回之前初始化您的小部件。

    var PanelCustomer =  declare([_WidgetBase, _TemplatedMixin, _Panel], {
        templateString: template,
        appType: 'PanelCustomer',
        id: 'panelCustomer',
        title: 'Customer',
        postCreate: function () {
            this.inherited(arguments);
            this._render();
        },
        _render: function () {
            this._addBtn = new Button({
                id: 'addBtn',
                label: 'Add',
                onClick: function () {

                }.bind(this)
            }, 'addBtn');
        }
    });

    return new PanelCustomer();