3.6.4 页面控件--树控件

树控件分为两种，单表下拉树和复杂下拉树。单表下拉树适用于表字段引用了本表的场景，例如部门表的上级部门字段又引用了部门表，从而形成多级部门树的概念；复杂下拉树则可以利用关联字段形成关联字段分类作为树的上一层，如果关联字段对应的表还有关联字段，则还可以向上形成关联字段的关联字段的分类方式作为树的更上一层，以此类推。

如果希望用户选择这种表数据的时候缺省就用树控件而不是下拉数据集，就需要在表定义界面定义 默认树 的参数：

当然，我们也可以在控件配置中对树控件进行各种参数的手动控制：手动配置需要了解一个前提，就是目前树控件引用了页面的前端数据集，所以为了配合树控件的使用，页面中的变量集里一定不能少相关表的前端数据集。

如下图所示：

上面讲的树控件，都是d出式的，也可以制作嵌入式的，可以直接看到树控件里面的全貌

通过选择上图中的模式可以切换树控件的显示模式。同时可以配置是否多选，是否展开节点，是否显示连接线等参数。

这个根节点的配置单表下拉树和复杂下拉树是一样的，这里不再赘述。

下面看一下单表下拉树控件的二级节点的配置

二级节点的配置界面和上面很像，只是没有设置父级引用列，这样从某种程度上就认为这一层是计算父子关系的结束层。

三级节点通过父级引用列对二级节点形成配对关系，这样就形成了部门-用户树。

我们可以在新建项目的导航树的控件演示/输入模块下找到相关的控件演示页面，这些页面演示了各种各样的参数配置情况。

还有一种就是直接给tree返回来的数据加个全选的数据就可以了

data里面的

html

方法 methods

Element-ui中tree树形控件全选与取消全选的功能实现（checkbox那种形式而不是tree）

//树形控件

//data里面的内容

//checkbox选择事件

1.dhtmlxTree

dHTMLxTree是一个功能丰富的Tree Menu控件。提供丰富的 *** 作API，AJAX支持和drag-n-drop功能。

2. Control.Treeview

采用Mootools开发的树形菜单控件。支持通过Ajax动态获取节点，设置默认选中某些节点。

3. Folder Tree

文件夹树形控件。支持利用拖放（drag and drop） *** 作来重新排序节点，利用Ajax更新节点。

4. DHTML Tree

这是一个基于标准Html结构构造的Tree控件。

5. dFTree

dFTree是一个javascript css Folder Tree支持利用Ajax技术动态新增/删除/修改节点等功能。

---