TreeField 树表单域

基于Tree组件封装的表单域组件,可通过v-model绑定值。内置单向级联逻辑

提示

组件会透传Tree组件支持的绝大部分属性和事件绑定以及插槽,部分属性设置了默认值,此外还有少数属性外部无法覆盖。具体见Tree Attributes

基础用法

在Form中使用

本例演示如何作为表单域使用,包括设置初始值,只读模式等。

自定义节点内容

提示

Tree组件文档参照 Tree(Element)

Attributes

参数 类型 说明 可选值 默认值
value/v-model string[] / number[] 绑定值, node-key指定属性对应值的数组 -- --
node-key string 和Tree组件同名属性意义一致,属性对应不上时无法查找节点会报错 -- 'id'
inline boolean 是否采用行内展示的形式。行内展示使用了flex布局让根节点在水平方向平铺,减少页面高度 -- --
data object[] 数据源 -- --
check-mode string 树节点的关联方式,对应Tree的check-strictly属性并增加了扩展。two-way对应false,none对应true,one-way为扩展关联方式(仅单向关联,父->子) two-way/one-way/none --
readonly boolean 展示模式,不显示checkbox,仅显示选中的节点文字 -- --

Methods

组件代理了Tree组件的所有方法,具体见Tree文档

Tree Attributes

仅列举原组件受影响的字段,其他字段见原组件文档。

参数 能否覆盖 默认值 说明
default-expand-all true 对于表单组件,默认展开所有节点毕竟方便操作
expand-on-click-node false 点击节点展开对于有checkbox时容易产生误操作,故默认关闭
check-strictly -- 组件内部维护了关联值,所以无法覆盖