带有 ObjectStore（本地 json）的 Dojo OnDemandGrid (dgrid)

Question

这段代码有什么问题？我可以获取我的 json 并使用警报对其进行调试（以便该部分与 xhr 一起使用）...例如，如果我在（xhr 的）函数中执行此操作，则 alert(data[0].name) 我得到正确的价值。网络上也没有太多示例......但是指定列并添加对象存储并没有显示任何内容......基本上，我只想加载一些 json 文件（本地）并将其呈现在网格上，但我最终将使用 REST 在我的应用程序中处理 CRUD（因此，我将在不久的将来使用 JsonRest）。

我认为它也与 AJAX 相关...我可能应该将同步设置为 true（因为我的全局变量似乎无法正常工作...未定义）。

define([
    "dojo/_base/declare",
    "dijit/_WidgetBase",
    "dgrid/OnDemandGrid",
    "dojo/_base/xhr",
    "dojo/store/Memory",
    "dojo/data/ObjectStore",
    "dgrid/Keyboard", 
    "dgrid/Selection"
], function(
    declare,
    _WidgetBase,
    Grid,
    xhr,
    Memory,
    ObjectStore,
    Keyboard, 
    Selection
){
    var dataStore;

    xhr.get({
        url: "app/resources/data/content.json",
        handleAs: "json"
    }).then(function(data){
    dataStore =  new ObjectStore({ objectStore:new Memory({ data: data.items }) });
    });

    return declare([_WidgetBase, Grid, Keyboard, Selection], {
    store: dataStore,
    columns:{
            name: { label: "name" },
            autodelete: { label: "autodelete" },
            groupe_id: { label: "groupe_id" },
            global: { label: "global" },
            date: { label: "date" },
            duree: { label: "duree" },
            description: { label: "description" },
            fichier: { label: "fichier" },
            pleinecran: { label: "pleinecran" },
            repertoire: { label: "repertoire" },
            taille: { label: "taille" },
            expiration: { label: "expiration" },
            id: { label: "id" },
            catergorie: { label: "catergorie" },
            brouillon: { label: "brouillon" }
        }, 

    postCreate: function() {
    }
});
});

Answer 1

由于某种原因，我无法将 objectStore 传递给商店（对于 dgrid - onDemandGrid）。这次我将“数据模型”和查看器分开了。所以，我在 app/models 中有这个（例如，我的代码非常模块化）：

define([
    "dojo/_base/xhr",
    "dojo/store/Memory",
    "dojo/store/Observable"],
function(
    xhr,
    Memory, 
    Observable
){

    xhr.get({
        url: "app/resources/data/content.json",
        handleAs: "json",
        sync: true,
    }).then(function(data){
        contentStore = Observable(Memory({data: data}));
    });

    // global var "song_store"
    return contentStore;
});

最后，我通过将商店附加到它（app/ui/layout/ContentGrid）来生成这样的网格。

define([
    "dojo/_base/declare",
    "dijit/_WidgetBase",
    "dgrid/OnDemandGrid",
    "dgrid/Keyboard", 
    "dgrid/Selection",
    "dgrid/extensions/ColumnHider",
    "dgrid/editor",
    "app/models/content"
], function(
    declare,
    _WidgetBase,
    Grid,
    xhr,
    Memory,
    ObjectStore,
    Keyboard, 
    Selection,
    Hider,
    editor
){

    return declare([Grid, Keyboard, Selection, Hider], {
        store: contentStore,
        /*columns: {
            selected: editor({
                    label: " ",
                    autoSave: true,
                    sortable: false
                }, "checkbox"),
            Name: "Name",
            Time: "Duration",
            Year: "Year",
            Artist: "Artist",
            Album: "Album",
            Genre: "Genre"
        },*/

    columns: {
        selected: editor({
                    label: " ",
                    autoSave: true,
                    sortable: false
                }, "checkbox"),
        nom: "Name",
        autodelete: "Auto-delete",
        groupe_id: "Groupe ID",
        global: "Global",
        date: "Date",
        duree: "Lenght",
        description: "Description",
        fichier: "Filename",
        pleinecran: "Fullscreen",
        repertoire: "Folder",
        taille: "Size",
        expiration: "Expired",
        id: "id",
        catergorie: "Category",
        brouillon: "Example"
    },

    });
});