[Reference] Tree

在screen文件中我们通过<a:tree>标签来定义一个tree对象.

<a:tree id="functionTree" bindTarget="function_tree_ds" displayField="function_name"
height="400" idField="function_id" parentField="parent_function_id" showCheckBox="false"
expandField="expanded" style="margin:5px;" width="300"/>
		

生成的界面如下:

树中的每一个节点都是对应所绑定的数据集(dataset)中每一条记录(record)。

节点与节点之间的层次关系是通过tree标签的属性idField和parentField来联系的，idField属性指定的是record中用来表示该节点的唯一标识(ID)的字段(field)名，parentField属性指定的record中用来表示该节点的父节点的ID的field名。

tree标签的属性displayField指定的record中用来表示节点文本信息的field名。

渲染函数(renderer)

很多情况下我们并不需要直接显示数据，而是需要对数据进行一下加工，例如我们需要将每个数节点变成一个可以导航页面的链接。这个时候我们就需要 在tree标签上指定renderer渲染函数来实现.

首先我们需要实现一个renderer函数，通过取得节点用来表示url的field值，返回一段外层套有a标签的html代码。

function linkrenderer(text, record, node){
    var url = record.get('command_line');
    if(url){
        return  '<a target="main" href="'+url+'">'+text+'</a>';
    }else{
        return text;
    }
}
		

接下来在tree标签上指定renderer属性为linkrenderer.

<a:tree renderer="linkrenderer"/>