禁用更新Dojo Grid

Disable updating a Dojo Grid

本文关键字：Grid Dojo 更新更新时间：2023-09-26

我在Dojo中有四个网格，它们每隔几秒更新一次实时数据。

我一次只向用户显示一个网格，但是在后台所有四个网格都会更新。这使得页面在移动设备上的速度变慢了很多(在PC上不明显)。

是否有一种方法来禁用更新网格，如果它不在视图中?

var myGrid = new (declare([Grid, DijitRegistry]))({
    store: myStore, // this is a Observable(Memory())
    columns:[
        {field: "field1", label: "A", sortable: false},
        {field: "field2", label: "B", sortable: false},
        {field: "field3", label: "C", sortable: false},
        {field: "field4", label: "D", sortable: false},
        {field: "field5", label: "E", sortable: false}
    ],
    selectionMode: "single",
    cellNavigation: true,
    queryOptions: {
        sort:[{attribute: "field1", descending: true}]
    }
},
    myDomRef
);

有没有类似

的东西

myGrid.disable();

和

myGrid.enable();

使DOM更新仅在启用Grid时发生?

如果您使用的是dgrid 0.3.17或dgrid 0.4.0，则有启用/禁用观察的选项，但它们仅在设置存储或集合时生效。

在dgrid 0.3.17中，属性是shouldObserveStore:

grid.set('shouldObserveStore', false);
grid.set('store', ...);

在dgrid 0.4.0中，属性是shouldTrackCollection:

grid.set('shouldTrackCollection', false);
grid.set('collection', ...);

下面是他们的Observables文档页面上的一个例子。我还没有测试过，但想法应该是一样的，你只需要找出细节。

require(["dojo/store/Observable", "dojo/store/Memory"], function (Observable, Memory) {
    var myGrid = new(declare([Grid, DijitRegistry]))({
            store: myStore, // this is a Observable(Memory())
            columns: [
                {
                    field: "field1",
                    label: "A",
                    sortable: false
                },
                {
                    field: "field2",
                    label: "B",
                    sortable: false
                },
                {
                    field: "field3",
                    label: "C",
                    sortable: false
                },
                {
                    field: "field4",
                    label: "D",
                    sortable: false
                },
                {
                    field: "field5",
                    label: "E",
                    sortable: false
                }
            ],
            selectionMode: "single",
            cellNavigation: true,
            queryOptions: {
                sort: [{
                    attribute: "field1",
                    descending: true
                }]
            }
        },
        myDomRef
    );
    // create the initial Observable store
    store = new Observable(new Memory({
        data: someData
    }));
    // query the store
    var results = store.query({
        rating: 5
    });
    // now listen for any changes
    var observeHandle = results.observe(function (object, removedFrom, insertedInto) {
        // do something
    });
    // done observing, any further modifications will not trigger our listener
    observeHandle.cancel();
});