SpTreeMultiSelect 多选树

这是一个 tree 多选选择器，可以使用标签的形式展现已选择内容。

基础用法

直接在对应位置引用组件即可，支持数据双向绑定。

<SpTreeMultiSelect v-model="value" />

API

属性

参数	类型	默认值	说明
model-value / v-model	T[]	-	绑定值
title	string	-	面板标题
width	number | string	240	面板宽度
showTags	boolean	true	是否显示已选择部门标签
placement	string	'bottom'	弹出框位置
leafOnly	boolean	false	是否仅返回叶子节点数据
includeHalfChecked	boolean	false	是否返回包含半选中节点数据
data	T[]	-	tree 数据
nodeKey	keyof T	id	每个树节点用来作为唯一标识的属性，整棵树应该是唯一的
labelName	keyof T	name	指定节点标签为节点对象的某个属性值
disabledNode	string | Function	-	指定节点选择框是否禁用为节点对象的某个属性值
searchInputSize	ComponentSize	'small'	检索输入框大小
searchInputPlaceholder	string	-	检索输入框的提示语
expandOnClickNode	boolean	false	是否在点击节点的时候展开或者收缩节点，如果为 false，则只有点箭头图标的时候才会展开或者收缩节点。
checkStrictly	boolean	false	在显示复选框的情况下，是否严格的遵循父子不互相关联的做法
simpleData	ToNestedOptions	-	是否使用简单数据模式，如果使用，请务必设置 idKey、pIdKey，并且让数据满足父子关系

事件

时间名	类型	说明
confirm	(value: T[]) => void	点击确认按钮事件
cancel	() => void	点击取消按钮事件
beforeEnter	() => void	打开面板动画播放前触发

插槽

插槽名	说明
default	自定义树节点的内容， 自定义树节点的内容， 参数为 { node, data }
reference	触发 Popover 显示的 HTML 元素，可以省略，默认会使用添加按钮

类型

ToNestedOptions

属性	类型	默认值	描述
idKey	string	id	节点数据中保存唯一标识的属性名称
pIdKey	string	parentId	节点数据中保存其父节点唯一标识的属性名称
renameKeys	[string, string][] | false	-	重命名的属性名称，元组的第一个元素为原始名字，第二个元素为新名字
copyKeys	[string, string][] | false	-	复制的属性名称，元组的第一个元素为原始名字，第二个元素为新名字

方法

getCheckedNodes

如果节点可以被选中，(show-checkbox 为 true), 本方法将返回当前选中节点的数组。

参数名	类型	默认值	说明
leafOnly	boolean	false	是否只返回叶子节点
includeHalfChecked	boolean	false	是否包含半选节点

setCheckedNodes

设置目前勾选的节点，使用此方法必须提前设置 node-key 属性。

参数名	类型	默认值	说明
nodes	Node[]	false	要选中的节点构成的数组
leafOnly	boolean	false	是否仅设置叶子节点

getCheckedKeys

若节点可用被选中 (show-checkbox 为 true), 它将返回当前选中节点 key 的数组

参数名	类型	默认值	说明
leafOnly	boolean	false	是否只返回叶子节点

setCheckedKeys

设置目前选中的节点，使用此方法必须设置 node-key 属性

参数名	类型	默认值	说明
keys	string[] | number[]	-	一个需要被选中的多节点 key 的数组
leafOnly	boolean	false	是否仅设置叶子节点

setChecked

设置节点是否被选中, 使用此方法必须设置 node-key 属性

参数名	类型	默认值	说明
data	string | T	-	要选中的节点的 key 或者数据
checked	boolean	false	是否选中
deep	boolean	false	是否递归选中子节点

getCurrentKey

返回当前被选中节点 key 的数据 (如果没有则返回 null)

getCurrentNode

返回当前被选中节点的数据 (如果没有则返回 null)

setCurrentKey

通过 key 设置某个节点的当前选中状态，使用此方法必须设置 node-key 属性

参数名	类型	默认值	说明
key	string | number	-	待被选节点的 key， 如果为 null, 取消当前选中的节点
shouldAutoExpandParent	boolean	true	是否自动展开父节点