EasyUI是一款非常實用的前端UI框架,非常方便的為前端頁面增添了美觀程度。在實現EasyUI中的嵌套json時也非常的簡單。
//嵌套json數據 var nestData = { "name": "product list", "data": [{ "product": { "id": "1", "name": "a" } }, { "product": { "id": "2", "name": "b" } }, { "product": { "id": "3", "name": "c" } } ] };
如上所示,可以在一個json對象中嵌套另一個json對象。通過這種方式可以更好地表示數據的層級以及關聯程度,使得數據結構更清晰易懂。
在EasyUI中,我們可以使用datagrid表格控件來展示數據,使用方法如下:
$("#datagrid").datagrid({ data: nestData.data, columns: [ [{ field: "id", title: "Id" }, { field: "name", title: "Name" } ] ] });
在這段代碼中,我們使用了datagrid控件,將nestData中的data數據展示在了表格中,其中id和name對應了嵌套json中product對象的屬性。通過這種方式,我們可以方便地展示復雜的數據結構。
總之,EasyUI的嵌套json功能為我們處理數據提供了很大的便利,如果你還沒有嘗試過,不妨在項目中中試試看吧。
上一篇vue做多項新增