easyui是一款非常流行的前端UI框架，其中樹狀菜單是很常用的組件之一。而easyui樹狀菜單使用json數據格式來渲染，本文將為大家詳細介紹easyui樹狀json的用法。
首先，樹狀json數據的格式一般包含id字段、text字段、children字段等。其中，id字段表示節點的唯一標識符，text字段表示節點的展示文本，children字段則表示該節點的子節點，是一個數組類型。具體格式如下：
var data = [
{
"id": 1,
"text": "根節點1",
"children": [
{
"id": 11,
"text": "子節點11"
},
{
"id": 12,
"text": "子節點12"
}
]
},
{
"id": 2,
"text": "根節點2",
"children": [
{
"id": 21,
"text": "子節點21"
},
{
"id": 22,
"text": "子節點22"
}
]
}
];上述代碼表示了一個包含兩個根節點、每個根節點有兩個子節點的樹狀json數據。接下來，在easyui中使用樹狀json數據渲染樹狀菜單，可以使用tree組件。我們需要在HTML文件中添加一段代碼：
<div id="tree">
然后，我們在JavaScript中使用下列代碼初始化tree組件：
$('#tree').tree({
data: data
});其中，data參數表示樹狀json數據。使用以上代碼，就可以在頁面中渲染出樹狀菜單。
當然，easyui的tree組件還有非常多的功能和配置項。比如，我們可以自定義每個節點的圖標、開啟節點多選功能、節點搜索等等。此處不再一一列舉，有興趣的讀者可以查看easyui的官方文檔，查找相關配置。
總的來說，easyui的樹狀json使用簡單方便、功能強大，可以滿足大部分前端樹形結構的需求。
下一篇vue做導航圖