定義model

Ext.define('Example.model.Contact', {
    extend: 'Ext.data.Model',
    fields: ['id', 'name', 'phone', 'email']
});

建立store

//方式一
var exampleStore = Ext.create('Ext.data.Store',{
    model: 'Example.model.Contact',
    autoLoad: true,
    pageSize: 35,
    autoLoad: {start: 0, limit: 35
 
},

    proxy: {
        type: 'ajax',
        api: {
            read : 'xxxxx/view.action',
            create : 'xxxxx/create.action',
            update: 'xxxxx/update.action',
            destroy: 'xxxxx/delete.action'
        },
        reader: {
            type: 'json',
            root: 'data',//表明返回的資料
 

            successProperty: 'success'//返回資料這個欄位的值表明返回資料成功與否
        },
        writer: {
            type: 'json',
            writeAllFields: true,
            encode: false,
            root: 'data'
        },
        listeners: {
            exception: function(proxy, response, operation){
                alert("Exception"
 
);
            }
        }
});
//方式二
直接在一個js檔案中自定義store
Ext.define('Example.store.Contacts', {
    extend: 'Ext.data.Store',
    model: 'Example.model.Contact',
    autoLoad: true,
    pageSize: 35,
    autoLoad: {start: 0, limit: 35},

    proxy: {
        type: 'ajax',
        api: {
            read : 'xxxxx/view.action',
            create : 'xxxxx/create.action',
            update: 'xxxxx/update.action',
            destroy: 'xxxxx/delete.action'
        },
        reader: {
            type: 'json',
            root: 'data',
            successProperty: 'success'
        },
        writer: {
            type: 'json',
            writeAllFields: true,
            encode: false,
            root: 'data'
        },
        listeners: {
            exception: function(proxy, response, operation){
                Ext.MessageBox.show({
                    title: 'REMOTE EXCEPTION',
                    msg: operation.getError(),
                    icon: Ext.MessageBox.ERROR,
                    buttons: Ext.Msg.OK
                });
            }
        }
    }
});
var exampleStore = Ext.create('Example.store.Contacts');

對store資料的增刪改

新增或者更新

 var win    = button.up('window'),
            form   = win.down('form'),
            record = form.getRecord(),//獲取記錄 可能是更新也可能是null
            values = form.getValues();//獲取資料


        if (values.id > 0){
            record.set(values); //更新資料
        } else{
            //建立一個新的資料物件
            record = Ext.create('Example.model.Contact');
            record.set(values);
            record.setId(0);
            **exampleStore.add(record); //store新增資料**
        }

        win.close();
        **exampleStore.sync();//觸發store發起連結請求，更新store中的變動資料。**

資料刪除

        var grid = this.getContactlist(), //獲取gridpanel物件
        record = grid.getSelectionModel().getSelection(), 
        store = this.getContactsStore();//獲取相應的store物件

        **store.remove(record);//在store中刪除這個record**
        **this.getContactsStore().sync();//觸發store發起連結請求，更新store中的變動資料。**

因為工作的需要，對Extjs6的使用稍微研究並記錄下，方便下次查閱。