2

我已经构建了一个 Dojo 小部件，用于通过输入值来创建列表。小部件代码是： define(["dojo/_base/declare", "dijit/_WidgetBase", "dijit/_TemplatedMixin", 'dojo/text!apps/orders/templates/multiAddList.html', "dojo/dom", "dojo/on", "dojo/dom-construct", "dojo/dom-class", "dojo/query", "dijit/focus"],

function (declare, WidgetBase, TemplatedMixin, html, dom, on, domConstruct, domClass, query, focusUtil) {

    return declare([WidgetBase, TemplatedMixin], {

        templateString: html,

        postCreate: function () {
            this.inherited(arguments);
            var that = this;
        },

        _checkIfEnter: function (e) {
            if (e.which == 13) {
                this._addUser();
            }
        },

        _addUser: function () {
            domClass.remove(this.ulAdded, "hidden");
            var textToAdd = this.userTextToAdd.value;
            var li = domConstruct.create("li", {}, this.ulAdded);
            domConstruct.create("span", {innerHTML: textToAdd}, li);
            var spanX = domConstruct.create("span", {class: 'icon-x right'}, li);
            this.itemsArray.push(textToAdd);
            this.userTextToAdd.value = "";
            focusUtil.focus(this.userTextToAdd);
            var that = this;
            on(spanX, "click", function () {
                domConstruct.destroy(li);
                that.itemsArray.splice(that.itemsArray.indexOf(textToAdd), 1);
                if (that.itemsArray.length == 0) {
                    domClass.add(that.ulAdded, "hidden");
                }
            });
        },

        itemsArray: []

    });
});

没关系。但是 - 当我在这样的同一个对话框中实例化它两次时：

allowedDomains = new MultiAddList();
allowedDomains.placeAt(dom.byId('allowedDomains'), 0);
pdlEmails = new MultiAddList();
pdlEmails.placeAt(dom.byId('pdlEmails'), 0);

然后询问 allowedDomains.itemsArray() 或 pdlEmails.itemsArray() - 我得到相同的列表（好像它是同一个实例） - 尽管在 UI 演示中 - 他分别正确地添加了列表项。

显然，尽管我遵循了 Dojo 示例，但我做错了。

有谁知道我应该怎么做才能让它工作？

谢谢

4

2 回答 2

4

当您使用声明创建一个 dojo 类时，对象和数组成员是静态的，这意味着它们是跨实例共享的，所以我建议在or某处执行itemsArray: null然后。this.itemsArray = []constructorpostCreate

其他一切看起来都很好，虽然我也喜欢 using hitch，但您的解决方案非常好。

于 2013-05-20T10:06:57.433 回答
0

抱歉只是给你一个提示，但你可能想看看 dojo.hicth() 函数，作为“this-that”构造的替代方法

on(spanX, "click", dojo.hitch(this, function () {
            domConstruct.destroy(li);
            this.itemsArray.splice(this.itemsArray.indexOf(textToAdd), 1);
            if (this.itemsArray.length == 0) {
                domClass.add(this.ulAdded, "hidden");
            }
        }));

on-construct 是一个很好的方法，但仅测试这种构造可能会告诉您这是否是问题所在。

_addUser: function () {
    .....
    .....
    dojo.connect(spanX, "click", this, this.spanClicked);
    or
    dojo.connect(spanX, "click", dojo.hitch(this, this.spanClicked);
},
spanClicked: function(args) {
    domConstruct.destroy(li); //need to keep some reference to li
    this.itemsArray.splice(this.itemsArray.indexOf(textToAdd), 1);
    if (that.itemsArray.length == 0) {
        domClass.add(this.ulAdded, "hidden");
    }
}
于 2013-05-19T15:02:42.420 回答