Javascript dojox/mobile/_StoreMixin标签和子属性

dojox/mobile/_StoreMixin有两个我很好奇的特性：

// labelProperty: String
// A property name (a property in the dojo/store item) that specifies that item's label.
labelProperty: "label"

// childrenProperty: String
// A property name (a property in the dojo/store item) that specifies that item's children.
childrenProperty: "children",

我不太确定在这种情况下如何重用或访问这些属性：

我有一个对象数组A，其中每个对象A包含一个对象数组B，如下所示：

var data = [{
    id: "1",
    content: "some info",
    items: [
        {id:"a"},
        {id:"b"},
        {id:"c"},
        {id:"d"}
    ]
},{
    id: "2",
    content: "some info",
    items: [
        {id:"e"},
        {id:"f"},
        {id:"g"},
        {id:"h"}
    ]
},{
    id: "3",
    content: "some info",
    items: [
        {id:"i"},
        {id:"j"},
        {id:"k"},
        {id:"l"}
    ]
},{
    id: "4",
    content: "some info",
    items: [
        {id:"m"},
        {id:"n"},
        {id:"o"},
        {id:"p"}
    ]
},];

我把数据放在dojo/store/Memory中，通过dojo/store/Observable可以观察到这些数据

现在我有一个名为W.js的小部件，它有一个dojox/mobile/_storemixinmixin，我将store设置为内存存储，上面有数据

你能举一些我能用labelProperty或childrenProperty做什么的例子吗？例如，我可以将childrenProperty设置为指向对象B数组中的项，然后对其进行处理吗？我已经搜索了几个例子，但找不到任何具体的例子

我想做的是将labelProperty设置为content属性，这样我可以打印出来，将childrenProperty设置为items，这样我也可以像前面提到的那样打印出来

---

谢谢。

我在下面写了一个简单的例子。它是一个简单的小部件，扩展了dojox/mobile/\u StoreMixin，使其具有商店感知能力。我没有实现onUpdate、onDelete和onAdd，但在那里留下了一些注释，说明它们的用途。可以在onComplete方法中引用labelProperty和childrenProperty的用法

我的示例使用dijit/_小部件和dijit/_TemplatedMixin使其成为具有额外模板支持的标准dojo小部件。您可能不需要模板支持。注意：我没有测试这个小部件，但它应该让您了解如何使用这两个字段

define([
    "dojo/_base/declare",
    "dojo/_base/array",
    "dojo/_base/lang",
    "dojo/dom-construct",
    "dijit/_Widget",
    "dijit/_TemplatedMixin",
    "dojox/mobile/_StoreMixin"
], function(
    delare,
    array,
    lang,
    domConstruct,
    _Widget,
    _TemplateMixin,
    _StoreMixin
) {

return declare("custom.W", _StoreMixin, {
    templateString: "<div data-dojo-attach-point='containerNode'></div>",

    labelProperty: 'content',
    childrenProperty: 'items',

    onComplete: function(items) {
        // loop through all the items and create individual div to display them
        array.forEach(items, lang.hitch(this, function(item) {
            // create the main div to show the label
            var labelNode = domConstruct.create('div', {
                // use the labelProperty here to pull the correct label property defined
                innerHTML: item[this.labelProperty]
            }, this.containerNode);

            // create an unorder list of all the items displaying its id
            var ulNode = domConstruct.create('ul', {}, labelNode);
            // use the childrenProperty here to find if this item has any children
            if(lang.isArray(item[this.childrenProperty])) {
                array.forEach(item[this.childrenProperty], lang.hitch(function(child) {
                    domConstruct.create('li', {
                        innerHTML: id
                    }, ulNode);
                }, this));
            }
        }));
    },

    onUpdate: function(item, insertedInto) {
        // locate the corresponding labelNode for this item and update the label

        // locate the corresponding ulNode for this item and add/remove any li that no longer exists in the children property
    },

    onDelete: function(item, removedFrom) {
        // locate the corresponding labelNode for this item and delete it

        // locate the corresponding ulNode for this item and delete it along with any of its children
    },

    onAdd: function(item, insertedInto) {
        // locate the labelNode at the given insertedInto index and add a new labelNode with the label for this item

        // create an unorder list of all the items displaying its id
    }
});

});