ExtJS是一個(gè)流行的JavaScript庫(kù),用于創(chuàng)建富客戶端Web應(yīng)用程序。在這個(gè)庫(kù)中,Store是一個(gè)非常重要的組件,用于在客戶端和服務(wù)器之間傳輸和存儲(chǔ)數(shù)據(jù)。使用ExtJS中store組件,可以輕松地從服務(wù)器中獲取JSON數(shù)據(jù)以供操作。
Ext.define('User', { extend: 'Ext.data.Model', fields: [ {name: 'id', type: 'int'}, {name: 'name', type: 'string'}, {name: 'email', type: 'string'} ] }); var userStore = Ext.create('Ext.data.Store', { model: 'User', proxy: { type: 'ajax', url: '/users.json', reader: { type: 'json', rootProperty: 'users' } }, autoLoad: true }); userStore.load({ callback: function(records, operation, success) { console.log(records); } });
在這個(gè)示例中,我們定義了一個(gè)名為User的模型,并與一個(gè)名為userStore的存儲(chǔ)器相關(guān)聯(lián)。這個(gè)存儲(chǔ)器使用AJAX代理來(lái)獲取服務(wù)器上的JSON數(shù)據(jù)文件。數(shù)據(jù)文件的路徑被指定在存儲(chǔ)器的URL屬性中,同時(shí)還定義了數(shù)據(jù)文件中的JSON根元素,這里是“users”。
調(diào)用load()方法會(huì)從服務(wù)器中異步加載數(shù)據(jù),并在加載完成后,將數(shù)據(jù)存儲(chǔ)在store中。這個(gè)函數(shù)使用一個(gè)回調(diào)函數(shù)來(lái)處理加載的數(shù)據(jù)。在JavaScript控制臺(tái)中,我們可以查看存儲(chǔ)器中的所有記錄。
總之,ExtJS中的store組件提供了一個(gè)易于使用的方法來(lái)獲取JSON數(shù)據(jù),并在Web應(yīng)用程序中使用它們。通過(guò)對(duì)store的配置和使用,可以輕松地從服務(wù)器中獲取數(shù)據(jù),并將它們添加到Store中。這對(duì)于開(kāi)發(fā)復(fù)雜的Web應(yīng)用程序來(lái)說(shuō)非常有用。