今天使用easyUI想完成一个树形菜单,后台部分的已经写好,传json给前端显示菜单。
发现easyui处理树形菜单的json必须按照它自己的格式,但是我后台的部分已经写好,又不想也不方便去修改。
发现easyui的tree组件提供了loadFilter方法,此方法可以把后台传过来的数据进行过滤,于是我打算在前台处理json。
这些是我的代码,只需修改几处代码就能实现后台json转成easyui规定的json格式了。
//此处是easyui的json格式
var tree = {
id:'',
text:'',
state:'',
checked:'',
attributes:'',
children:''
}
//此处是把后台传过来的json数据转成easyui规定的格式
function bl(item){
var tree = new Object();
tree.id = item.id;
tree.text = item.name;
tree.state = 'open';
tree.checked = 'false';
tree.attributes = item.url;
if(item.child_menus.length != 0){
tree.children = jsonbl(item.child_menus);
}else{
tree.children = [];
}
return tree;
}
function jsonbl(data){
var easyTree = [];
$.each(data,function(index,item){
easyTree[index] = bl(item);
});
return easyTree;
}
//此处是easyui调用tree组件的方法(使用easyui的童鞋自然懂得,只需修改请求json的api即可)
$('#tt').tree({
url: '${pageContext.request.contextPath}/sysmenu/all',
loadFilter: function(data){
return jsonbl(data);
}
});
网友评论