• 目的:在浏览器上浏览电脑指定目录。
• 技术:golang,jstree

1. golang生成jstree识别的json

1.1 使用"io/ioutil"读取指定目录

fileinfos, err := ioutil.ReadDir(dirpath)
if err != nil {
 log.Println("ReadDir error!" + dirpath)
}

1.2 使用"encoding/json"生成json数据

type treestate struct {
 Opened bool `json:"opened"`
 Disabled bool `json:"disabled"`
 Selected bool `json:"selected"`
}
type filetree struct {
 Id string `json:"id"`
 Text string `json:"text"`
 Icon string `json:"icon,omitempty"`
 State *treestate `json:"state,omitempty"`
 Children bool `json:"children,omitempty"`
 Li_attr map[string]string `json:"li_attr,omitempty"`
 A_attr map[string]string `json:"a_attr,omitempty"`
}

1.2.1 忽略为空的项

在声明struct时对不必要的项添加omitempty,这样在生成json时如果该项为空就会忽略。

1.2.2 嵌套json

• struct中嵌套struct,如*treestate

state := &treestate{Selected: true} // Selected为true的话,在jstree中会默认选中
tree.State = state

• struct中使用map,如map[string]string

// A_attr的href项表示该文件选项的链接地址
tree.A_attr = map[string]string{"href": "/download?file=" + tree.Id}

2. jstree使用ajax

<div id="using_ajax"></div>
<script type="text/javascript">
$('#using_ajax').jstree({
 'core' : {
 'data' : {
 'url' : "/tree_file",
 "dataType" : "json",
 'data' : function (node) {
 if (node.id==='#') {
 return { 'id' : "D:" }; //根目录为D盘
 } else {
 return { 'id' : node.id };
 }
 }
 }
 }
});
</script>

完整代码:

tree.html
treefile.go

有疑问加站长微信联系(非本文作者)

• 请尽量让自己的回复能够对别人有帮助
• 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
• 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
• 图片支持拖拽、截图粘贴等方式上传