色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

ext.grid.panel 里面的json

張吉惟2年前9瀏覽0評論

在使用ext.grid.panel 組件時,我們經常需要傳入一些數據來進行填充。這些數據通常以json格式提供,因此我們需要了解如何正確解析和使用json數據。


下面是一個簡單的json數據示例:

{
"data": [
{
"name": "張三",
"age": 20,
"address": "北京市海淀區"
},
{
"name": "李四",
"age": 25,
"address": "上海市浦東新區"
},
{
"name": "王五",
"age": 30,
"address": "廣州市天河區"
}
]
}

在使用這個json數據時,我們需要先創建一個Ext.data.Store對象并指定數據模型:

var store = Ext.create('Ext.data.Store', {
model: 'User',
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'data'
}
}
});

這里的模型是一個自定義的Ext.data.Model對象,它用來描述json數據的格式:

Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'name', type: 'string'},
{name: 'age', type: 'int'},
{name: 'address', type: 'string'}
]
});

模型指定了三個屬性分別對應json數據中的name、age、address字段。而Ext.data.Store對象則使用reader配置指定數據的解析方式,由于我們的數據是一個數組,因此需要設置rootProperty為"data"。


最后,我們將這個數據源綁定到ext.grid.panel組件中:

var grid = Ext.create('Ext.grid.Panel', {
store: store,
columns: [
{text: '姓名', dataIndex: 'name'},
{text: '年齡', dataIndex: 'age'},
{text: '地址', dataIndex: 'address'}
]
});

這樣我們就可以通過grid的數據展示功能,將json數據以表格的形式展現出來了。