Grid Panel是常見的Ext JS組件之一,它可以展示數據集合并且具有很好的可擴展性和定制性。而JSON(JavaScript Object Notation)是一種常見的數據傳輸格式,可用于將JavaScript對象序列化為字符串以便傳輸給其他程序。在Grid Panel中使用JSON,可以更方便地展示數據集合。
JSON數據集合可以通過Ajax請求或API調用傳遞到Grid Panel中,并在客戶端渲染。下面是使用JSON數據集合渲染Grid Panel的示例代碼:
Ext.define('User', { extend: 'Ext.data.Model', fields: [ { name: 'id', type: 'int' }, { name: 'name', type: 'string' }, { name: 'email', type: 'string' }, { name: 'phone', type: 'string' } ] }); var store = Ext.create('Ext.data.Store', { model: 'User', proxy: { type: 'ajax', url : 'data.json', reader: { type: 'json', rootProperty: 'users' } }, autoLoad: true }); var grid = Ext.create('Ext.grid.Panel', { renderTo: Ext.getBody(), store: store, width: 400, height: 200, columns: [ { text: 'ID', dataIndex: 'id' }, { text: 'Name', dataIndex: 'name' }, { text: 'Email', dataIndex: 'email' }, { text: 'Phone', dataIndex: 'phone' } ] });
在這個示例中,我們定義了一個User模型,然后創建了一個Store,指定了JSON數據的URL和讀取器。最后,我們創建了一個Grid Panel,并指定了要展示的數據集合和列。Grid Panel會從Store中自動加載數據,并將其展示在頁面上。
總之,使用JSON數據集合在Grid Panel中渲染數據可以有效地提高數據展示的效率和便利性。它是Ext JS開發中廣泛使用的一種技術。
上一篇python 怎么寫腳本
下一篇python 除以得小數