Tab定义

在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"/>

Tree标签属性

Table 1.

属性名	用途	默认值
checkField	record中用来显示树节点是否被选中的field。只有在属性showCheckBox为true的情况下才有效果。	`checked`
displayField	record中用来显示树节点文本信息的field。	`name`
expandField	record中用来表示树节点是否被伸展的field。	`expanded`
idField	record中用来指定树节点唯一标识的field。	`id`
parentField	record中用来指定树节点的父节点唯一标识的field。	`pid`
renderer	节点渲染器
sequenceField	record中用来指定树节点序号的field。	`sequence`
showCheckBox	是否显示多选框	`false`

Tree组件

Tab定义

树节点渲染

Tree标签属性