extjs 列表 分页 样例

以下是一个简单的 ExtJS 列表分页样例：

Ext.create('Ext.grid.Panel', {
    title: 'My Grid Panel',
    store: Ext.create('Ext.data.Store', {
        fields: ['name', 'age', 'gender'],
        pageSize: 2, // 设置每页显示的记录数
        proxy: {
            type: 'ajax',
            url: 'data.json',
            reader: {
                type: 'json',
                rootProperty: 'data'
            }
        },
        autoLoad: true
    }),
    columns: [
        { text: 'Name', dataIndex: 'name' },
        { text: 'Age', dataIndex: 'age' },
        { text: 'Gender', dataIndex: 'gender' }
    ],
    height: 200,
    width: 400,
    dockedItems: [{
        xtype: 'pagingtoolbar', // 分页工具栏
        store: store, // 指定 store
        dock: 'bottom',
        displayInfo: true
    }],
    renderTo: Ext.getBody()
});

这个样例创建了一个包含三列的列表，每列分别显示人名、年龄和性别。列表中的数据从一个 JSON 文件中加载，通过 `pageSize` 属性设置每页显示的记录数。通过 `dockedItems` 属性添加一个分页工具栏，通过 `store` 属性指定 store，以实现分页功能。