Question

我正在使用ExtJS缓冲存储来进行分页和其他目的。我想在缓冲存储中加载数据。在普通商店我可以使用

store.loadData(thistore.data.items);

但是在缓冲商店中，我无法使用loadData。我可以根据我的代码看到我收到数据作为回应，但我不知道如何设置数据。可以帮助我loadData

中Ext.data.BufferedStore的替代方案

Answer 1

store.load({
        callback: function(records, operation, success) {
            console.log(records);
        }
    });

<强>更新

基于this sencha示例，我使用extjs 6.5.2 classic为您创建了一个示例。我使用了经典工具包，因为在现代virtualstore中使用的是bufferedstore。

以下是代码：

Ext.define('ForumThread', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'title',
        mapping: 'topic_title'
    }, {
        name: 'forumtitle',
        mapping: 'forum_title'
    }, {
        name: 'forumid',
        type: 'int'
    }, {
        name: 'username',
        mapping: 'author'
    }, {
            name: 'replycount', 
            mapping: 'reply_count',
            type: 'int'
    }, {
            name: 'lastpost', 
            mapping: 'post_time', 
            type: 'date', 
            dateFormat: 'timestamp'
    },
        'lastposter', 'excerpt', 'topic_id'
    ],
    idProperty: 'post_id'
});

var store = Ext.create('Ext.data.BufferedStore', {
    id: 'store',
    model: 'ForumThread',

    // The topics-remote.php script appears to be hardcoded to use 50, and ignores this parameter, so we
    // are forced to use 50 here instead of a possibly more efficient value.
    pageSize: 50,

    // This web service seems slow, so keep lots of data in the pipeline ahead!
    leadingBufferZone: 1000,
    proxy: {
        // load using script tags for cross domain, if the data in on the same domain as
        // this page, an HttpProxy would be better
        type: 'jsonp',
        url: 'https://www.sencha.com/forum/topics-remote.php',
        reader: {
            rootProperty: 'topics',
            totalProperty: 'totalCount'
        },
        // sends single sort as multi parameter
        simpleSortMode: true,

        // Parameter name to send filtering information in
        filterParam: 'query',
    },
    remoteFilter: true,
    autoLoad: false
});

function onSearchParamApplied () {
    var searchParam = grid.down('#txtSearchParam').getValue();

    var store = grid.getStore();
    if (!store)
        return;

    store.getProxy().extraParams['query'] = searchParam;

    store.reload({ 
        callback: function (records, operation, success) {
            grid.down('#status').setValue(store.getTotalCount());
        }
    });
}

function onStoreLoadClick () {
    var store = grid.getStore();
    if (!store)
        return;

    store.load({ 
        callback: function (records, operation, success) {
            grid.down('#status').setValue(store.getTotalCount());
        }
    });
}

var grid = Ext.create('Ext.grid.Panel', {
    width: 700,
    height: 470,
    padding: 10,
    collapsible: true,
    title: 'ExtJS.com - Browse Forums',
    store: store,
    loadMask: true,
    dockedItems: [{
        dock: 'top',
        xtype: 'toolbar',
        items: [{
            xtype: 'textfield',
            itemId: 'txtSearchParam',
            width: 400,
            fieldLabel: 'Search',
            labelWidth: 50,
        }, {
            xtype: 'button',
            iconCls: 'x-fa fa-search',
            tooltip: 'Reload buffered store with the new param',
            handler: onSearchParamApplied
        }, {
            xtype: 'button',
            text: 'loadGrid',
            handler: onStoreLoadClick
        },'->', {
            xtype: 'displayfield',
            itemId: 'status',
            fieldLabel: 'Count ',
            value: '0' //initial value
        }]
    }],
    selModel: {
        pruneRemoved: false
    },
    multiSelect: true,
    viewConfig: {
        trackOver: false,
        emptyText: '<h1 style="margin:20px">No matching results</h1>'
    },
    // grid columns
    columns:[{
        xtype: 'rownumberer',
        width: 50,
        sortable: false
    },{
        tdCls: 'x-grid-cell-topic',
        text: "Topic",
        dataIndex: 'title',
        flex: 1,
        //renderer: renderTopic,
        sortable: false
    },{
        text: "Author",
        dataIndex: 'username',
        width: 100,
        hidden: true,
        sortable: false
    },{
        text: "Replies",
        dataIndex: 'replycount',
        align: 'center',
        width: 70,
        sortable: false
    },{
        id: 'last',
        text: "Last Post",
        dataIndex: 'lastpost',
        width: 130,
        renderer: Ext.util.Format.dateRenderer('n/j/Y g:i A'),
        sortable: false
    }],
    renderTo: Ext.getBody()
});

兴趣点：

- 点击＆＃34; loadGrid＆＃34; button加载记录。

- 将一些文字添加到＆＃34;搜索＆＃34; textfield并点击搜索按钮，根据您输入的文字提供的查询刷新网格。

您还可以在sencha fiddle内添加代码（从右上角选择一个经典主题）并运行它。

我希望我帮助过。

如何在Buffered Store中设置数据

1 个答案: