沃梦达 / IT编程 / 前端开发 / 正文

关于 extjs:Sencha Touch – 离线应用程序与离线存

Sencha Touch - Offline Application with offlineStorage synced to a online store. Fetch online data on demand and add to offlineStoreage我正在开发一...

我正在开发一个带有 sencha touch 的 Web 应用程序。我需要实现一个离线可用(offlineStorage)但获取的商店(绑定到网格)

相关讨论


在 Sencha Touch 中,将获取的数据"同步"和在线商店到另一个"离线"商店非常容易。

定义一个离线商店:

1
2
3
4
5
6
7
8
9
    // Offline store (local storage)
    var schouwLijstOffline = new Ext.data.Store({
        model:"schouwLijst",
        storeId: 'schouwLijstOffline',
        proxy: {
            type: 'localstorage',
            id:"schouwid"
        },
    });

您现在可以在主存储上使用侦听器(第一次获取数据)并侦听加载事件(在这种情况下,由于"autoLoad: false"而手动触发。

在加载器中,您"clear()"离线存储的代理,然后使用"storeId"*.add()* 函数将数据填充到离线存储。

在我的示例中,然后我从"离线商店"中删除所有信息,因为我不再需要它(它现在在离线商店中。

带有监听器的在线商店:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
var schouwLijstStore = new Ext.data.Store({

            model:"schouwLijst",
            storeId:"schouwLijstStore",
            proxy: {
                type: 'ajax',
                url: 'php/json.php?t=list',
                reader: {
                    type: 'json',
                    root: 'list'
                },  
            },    
            autoLoad: false,
            listeners: {
                load: function() {

                    // Clear proxy from offline store
                    schouwLijstOffline.proxy.clear();

                    // Loop through records and fill the offline store
                    this.each(function(record) {

                        schouwLijstOffline.add(record.data);

                    });

                    // Sync the offline store
                    schouwLijstOffline.sync();

                    // Remove data from online store
                    schouwLijstStore.removeAll();

                }

            }

        });

现在,当您发出新请求以获取新过滤器/数据时,您可以重复相同的过程:

  • 触发在线商店 (storeId.update();)
  • 侦听器将数据从在线商店添加到离线商店
  • 使用离线商店

补充:

要从存储中删除所有数据,您可以使用:storeId.removeAll();

我认为这会让你朝着正确的方向前进,如果有不清楚的地方请说出来。

本文标题为:关于 extjs:Sencha Touch – 离线应用程序与离线存