在不久前的一个项目中接触到easyui,由于对此框架并不是太了解,所以当项目中需要更换结构树中图标时觉得非常不容易,在网上也查了很多资料也没有一个很有效的解决方法,经过自己一步步对这个框架的深入了解,才最终得以解决,以下是此问题的两种解决方法步骤:
方法一:
更改前的图标示例:
1.在更换图标的css文件(/easyui/themes/default/easyui.css)中找到如下的代码:
2.根据上一步的代码找到相应的图片(图片路径:/easyui/themes/default/images/tree_icons.png),并将图中小黄色图标改成要替换的图标:
注:之前的图标为黄色图标。
3.将改好的图片放到文件中替换之前的图片,重启项目就成功更改图标了,效果如下:
方法二:在如图目录下:
1.在文件icon.css中添加icon-save
如下图:
2.然后在生成数据的代码中加入红色部分
{
"id":1,
"text":"Folder1",
"iconCls":"icon-save",
"children":[{
"text":"File1",
"checked":true
},{
"text":"Books",
"state":"open",
"attributes":{
"url":"/demo/book/abc",
"price":100
},
"children":[{
"text":"PhotoShop",
"checked":true
},{
"id": 8,
"text":"Sub Bookds",
"state":"closed"
}]
}]
}
红色处修改树形结点的图标