From 267ef6d9e9d186a3b95195628280874a72c947da Mon Sep 17 00:00:00 2001 From: pengYYY Date: Mon, 14 Aug 2023 15:31:27 +0800 Subject: [PATCH] feat: tree-select add keys api --- src/tree-select/props.ts | 4 ++++ src/tree-select/tree-select.en-US.md | 1 + src/tree-select/tree-select.md | 2 ++ src/tree-select/tree-select.tsx | 1 + src/tree-select/type.ts | 6 +++++- 5 files changed, 13 insertions(+), 1 deletion(-) diff --git a/src/tree-select/props.ts b/src/tree-select/props.ts index 178408800b..3eab44ff46 100644 --- a/src/tree-select/props.ts +++ b/src/tree-select/props.ts @@ -49,6 +49,10 @@ export default { defaultInputValue: { type: [String, Number] as PropType, }, + /** 用来定义 `value / label / children / disabled` 在 `data` 数据中对应的字段别名，示例：`{ value: 'key', label 'name', children: 'list' }` */ + keys: { + type: Object as PropType, + }, /** 是否正在加载数据 */ loading: Boolean, /** 远程加载时显示的文字，支持自定义。如加上超链接 */ diff --git a/src/tree-select/tree-select.en-US.md b/src/tree-select/tree-select.en-US.md index faa2c8e319..c36e7cdb52 100644 --- a/src/tree-select/tree-select.en-US.md +++ b/src/tree-select/tree-select.en-US.md @@ -18,6 +18,7 @@ filterable | Boolean | false | \- | N inputProps | Object | - | Typescript：`InputProps`，[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/tree-select/type.ts) | N inputValue | String / Number | - | input value。`v-model:inputValue` is supported。Typescript：`InputValue`，[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/tree-select/type.ts) | N defaultInputValue | String / Number | - | input value。uncontrolled property。Typescript：`InputValue`，[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/tree-select/type.ts) | N +keys | Object | - | Typescript：`TreeKeysType`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N loading | Boolean | false | \- | N loadingText | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N max | Number | 0 | \- | N diff --git a/src/tree-select/tree-select.md b/src/tree-select/tree-select.md index 6b3cdfae5d..01da3f2a9a 100644 --- a/src/tree-select/tree-select.md +++ b/src/tree-select/tree-select.md @@ -17,6 +17,8 @@ filterable | Boolean | false | 是否可搜索 | N inputProps | Object | - | 透传给 输入框 Input 组件的全部属性。TS 类型：`InputProps`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/tree-select/type.ts) | N inputValue | String / Number | - | 输入框的值。支持语法糖 `v-model:inputValue`。TS 类型：`InputValue`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/tree-select/type.ts) | N defaultInputValue | String / Number | - | 输入框的值。非受控属性。TS 类型：`InputValue`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/tree-select/type.ts) | N +keys | Object | - | 用来定义 `value / label / children / disabled` 在 `data` 数据中对应的字段别名，示例：`{ value: 'key', label 'name', children: 'list' }`。TS 类型：`TreeKeysType`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N +label | String / Slot / Function | - | 左侧文本。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N loading | Boolean | false | 是否正在加载数据 | N loadingText | String / Slot / Function | - | 远程加载时显示的文字，支持自定义。如加上超链接。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N max | Number | 0 | 用于控制多选数量，值为 0 则不限制 | N diff --git a/src/tree-select/tree-select.tsx b/src/tree-select/tree-select.tsx index d3341bc7d2..88f81a9ced 100644 --- a/src/tree-select/tree-select.tsx +++ b/src/tree-select/tree-select.tsx @@ -339,6 +339,7 @@ export default defineComponent({ key={treeKey.value} value={[...checked.value]} hover + keys={props.keys} data={props.data} activable={!props.multiple} checkable={props.multiple} diff --git a/src/tree-select/type.ts b/src/tree-select/type.ts index bb622bde8e..8c28ea84cd 100644 --- a/src/tree-select/type.ts +++ b/src/tree-select/type.ts @@ -9,7 +9,7 @@ import { InputValue } from '../input'; import { PopupProps } from '../popup'; import { SelectInputProps } from '../select-input'; import { TagProps } from '../tag'; -import { TreeProps, TreeNodeModel } from '../tree'; +import { TreeProps, TreeNodeModel, TreeKeysType } from '../tree'; import { SelectInputValueChangeContext } from '../select-input'; import { PopupVisibleChangeContext } from '../popup'; import { TNode, TreeOptionData } from '../common'; @@ -70,6 +70,10 @@ export interface TdTreeSelectProps