解决Extjs MVC store无法加载

最新推荐文章于 2017-09-14 15:12:25 发布

原创最新推荐文章于 2017-09-14 15:12:25 发布 · 1.6k 阅读

1 ·

CC 4.0 BY-SA版权

ExtJs 专栏收录该内容

13 篇文章

订阅专栏

本文展示了一个使用ExtJS框架创建网格面板的具体示例。该示例定义了一个名为'AM.view.show.GridPanel'的组件，它继承自'Ext.grid.Panel'，并配置了自定义的用户数据存储、分页工具栏及列头。通过此教程，读者可以了解到如何初始化组件、加载数据及设置显示样式。

使用initComponent参数将数据实例化别忘了重新生成视图 this.callParent(arguments);

Ext.define('AM.view.show.GridPanel', {
     extend: 'Ext.grid.Panel',
     alias: 'widget.alias_gridpanel',
     title: 'All Users',
     initComponent: function () {
         var mystore = Ext.create('AM.store.UserStore');
         this.store = mystore;
         mystore.load({
             params: {
                 start: 0,
                 limit: 2
             }
         });
         this.dockedItems = [{
             xtype: 'pagingtoolbar',
             store: mystore, // same store GridPanel is using
             dock: 'bottom',
             displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
             emptyMsg: '没有数据',
             displayInfo: true
         }];

         this.columns = [{
             header: 'ID',
             dataIndex: 'id',
             flex: 1
         }, {
             header: 'Name',
             dataIndex: 'name',
             flex: 1
         }, {
             header: 'Password',
             dataIndex: 'password',
             flex: 1
         }];
         this.callParent(arguments);
     }

 });