更新记录

1.0.8(2024-12-06) 下载此版本

修改说明

1.0.7(2024-12-06) 下载此版本

修改说明

1.0.6(2024-12-02) 下载此版本

修改说明

查看更多

平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.8.3 app-vue × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
× × × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× ×

lu-data -tree

原作者插件地址:https://ext.dcloud.net.cn/plugin?id=12384

  1. 修改为兼容 vue2、vue3 的版本
  2. 单选的时候禁止反选
  3. 选中改变时添加返回 所有父级【parents】数组
  4. 单选时,选中以后,禁止取消,其他功能不变
  5. 去掉field配置

组件参数

属性 类型 默认值 必填 说明
data Array - 树的数据
themeColor String #007aff 主题色,十六进制
defaultCheckedKeys Array \ Number | String - 默认选中的节点,单选为单个 key,多选为 key 的数组
showCheckbox Boolean false 是否开启多选,默认单选
checkStrictly Boolean false 多选时,是否执行父子不关联的任意勾选,默认父子关联
showRadioIcon Boolean true 是否显示单选图标,默认显示
onlyRadioLeaf Boolean true 单选时只允许选中末级,默认可随意选中
defaultExpandAll Boolean false 是否默认展开全部
defaultExpandedKeys Array - 默认展开的节点
indent Number 40 子项缩进距离,单位 rpx
checkboxPlacement String left 选择框的位置,可选 left/right
loadMode Boolean false 为 true 时,空的 children 数组会显示展开图标
loadApi Function - 选择框的位置,可选 left/right
checkedDisabled Boolean false 是否渲染禁用值,默认不渲染
packDisabledkey Boolean true 是否返回已禁用的但已选中的 key,默认返回禁用已选值
expandChecked Boolean false 是否自动展开到选中的节点,默认不展开
alwaysFirstLoad Boolean false 是否总在首次的时候加载一下内容,默认不加载,否则只有展开末级节点才会加载数据
isLeafFn Function - 自定义函数返回来控制数据项的末项
labelField String label 指定节点对象中某个属性为标签字段,默认label
valueField String value 指定节点对象中某个属性为值字段,默认value
childrenField String children 指定节点对象中某个属性为子树节点字段,默认children
disabledField String disabled 指定节点对象中某个属性为禁用字段,默认disabled
appendField String append 指定节点对象中某个属性为副标签字段,默认append
leafField String leaf 指定节点对象中某个属性为末级节点字段,默认leaf
sortField String sort 指定节点对象中某个属性为排序字段,默认sort
filterValue String - 搜索筛选的关键词,通过输入关键词筛选内容

组件事件

事件名称 回调参数 说明
change (allCheckedKeys, currentItem) => void 选中时回调
expand (expandState, currentItem) => void 展开/收起时回调

组件方法

方法名称 参数 说明
setCheckedKeys (keys,checked) 设置指定 key 的节点选中/取消选中的状态。注: keys 单选时为 key,多选时为 key 的数组
setExpandedKeys (keys,expand) 设置指定 key 的节点展开/收起的状态,当 keys 为 all 时即代表展开/收起全部。注:keys 为数组或 all
getCheckedKeys - 返回已选的 key
getHalfCheckedKeys - 返回半选的 key
getUncheckedKeys - 返回未选的 key
getCheckedNodes - 返回已选的节点
getUncheckedNodes - 返回未选的节点
getHalfCheckedNodes - 返回半选的节点
getExpandedKeys - 返回已展开的 key
getUnexpandedKeys - 返回未展开的 key
getExpandedNodes - 返回已展开的节点
getUnexpandedNodes - 返回未展开的节点

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议
XY雲

2024-12-31

示例编译报错。

想喝冰阔落 2025-01-07

vue2的吗,示例代码用的setup写法,vue2不支持

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问