Question

要求：

需要使用HashMap存储特定值。这些值第一次设置为HashMap，在屏幕刷新或导航后返回到同一屏幕，需要在UI本身的HashMap中保留值，而不需要创建后端/ DB调用

声明和使用此HashMap的最佳方式是什么，以便仅初始化，但在屏幕刷新和导航时保留附加值？

我们如何声明和 初始化 此HashMap为静态变量 ？

Answer 1

您可以使用带有LocalStorage Proxy的ExtJS Store来部分实现它。本地存储允许您在浏览器空间中存储数据。在页面重新加载时，数据将是持久性的（仅在浏览器中的相同用户配置文件中）。

此商店数据在其他浏览器中不可用。如果您正在寻找跨浏览器的HTTP响应的用户特定缓存，那么它必须位于服务器端。

以下是针对相同浏览器和相同用户个人资料的POC实施：

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.define('twitter', {
            extend: 'Ext.data.Model',
            fields: ['id', 'name'],
            proxy: {
                type: 'localstorage',
                id: 'twitter-Searches'
            }
        });

        //our Store automatically picks up the LocalStorageProxy defined on the Search model
        var store = new Ext.data.Store({
            model: "twitter"
        });

        //loads any existing Search data from localStorage
        store.load();

        console.log(store);

        Ext.create('Ext.panel.Panel', {
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'grid',
                store: store,
                id: 'gridId',
                columns: [{
                    text: 'id',
                    flex: 1,
                    dataIndex: 'id'
                }, {
                    text: 'name',
                    flex: 1,
                    dataIndex: 'name'
                }],
                buttons: [{
                    text: 'Add new record',
                    handler: function () {
                        var grid = Ext.getCmp("gridId");
                        var record = {
                            //id: Math.random().toString(36).substring(7),
                            name: Math.random().toString(36).substring(7)
                        };

                        store.add(record);
                        store.sync();
                    }
                }, {
                    text: "Clear all",
                    handler: function () {
                        var grid = Ext.getCmp("gridId");
                        store.removeAll();
                        store.sync();

                    }
                }]
            }]
        });
    }
});

以下是相同的小提琴： https://fiddle.sencha.com/#view/editor&fiddle/2cgt

在小提琴中，重新加载小提琴后，数据将从本地存储中获取。

如何在ExtJS中声明静态HashMap？

1 个答案: