@antsoo-lib/components 0.1.11 → 0.1.13

package/src/tree-select/index.en-US.md

@@ -1,100 +0,0 @@
----
-category: Components
-type: Data Entry
-title: TreeSelect
-cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*DfTMRYSDngEAAAAAAAAAAAAADrJ8AQ/original
-coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*Y5pcQLplFu4AAAAAAAAAAAAADrJ8AQ/original
----
-
-Tree selection control.
-
-## When To Use
-
-`TreeSelect` is similar to `Select`, but the values are provided in a tree like structure. Any data whose entries are defined in a hierarchical manner is fit to use this control. Examples of such case may include a corporate hierarchy, a directory structure, and so on.
-
-## API
-
-### Tree props
-
-| Property                  | Description                                                                                                                                                                                                                                                | Type                                                                              | Default                                                | Version |                          |
-| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- | ------------------------------------------------------ | ------- | ------------------------ |
-| allowClear                | Whether allow clear                                                                                                                                                                                                                                        | boolean                                                                           | false                                                  |         |                          |
-| defaultValue              | To set the initial selected treeNode(s).                                                                                                                                                                                                                   | string\|string\[]                                                                 | -                                                      |         |                          |
-| disabled                  | Disabled or not                                                                                                                                                                                                                                            | boolean                                                                           | false                                                  |         |                          |
-| popupClassName            | className of dropdown menu                                                                                                                                                                                                                                 | string                                                                            | -                                                      |         | 4.0                      |
-| dropdownMatchSelectWidth  | Determine whether the dropdown menu and the select input are the same width. Default set `min-width` same as input. Will ignore when value less than select width. `false` will disable virtual scroll                                                     | boolean \| number                                                                 | true                                                   |         |                          |
-| dropdownStyle             | To set the style of the dropdown menu                                                                                                                                                                                                                      | object                                                                            | -                                                      |         |                          |
-| fieldNames                | Replace the label,value and children fields in treeNode with the corresponding fields in treeData                                                                                                                                                          | object                                                                            | { children:'children', label:'title', value:'value' }  |         | 3.0.0                    |
-| filterTreeNode            | Whether to filter treeNodes by input value. The value of `treeNodeFilterProp` is used for filtering by default.                                                                                                                                            | boolean\|Function(inputValue: string, treeNode: TreeNode) (should return boolean) | Function                                               |         |                          |
-| getPopupContainer         | To set the container of the dropdown menu. The default is to create a `div` element in `body`, you can reset it to the scrolling area and make a relative reposition.                                                                                      | Function(triggerNode)                                                             | () => document.body                                    |         |                          |
-| labelInValue              | whether to embed label in value, turn the format of value from `string` to `{value: string, label: VNode, halfChecked: string[]}`                                                                                                                          | boolean                                                                           | false                                                  |         |                          |
-| listHeight                | Config popup height                                                                                                                                                                                                                                        | number                                                                            | 256                                                    |         |                          |
-| loadData                  | Load data asynchronously.                                                                                                                                                                                                                                  | function(node)                                                                    | -                                                      |         |                          |
-| maxTagCount               | Max tag count to show                                                                                                                                                                                                                                      | number                                                                            | -                                                      |         |                          |
-| maxTagPlaceholder         | Placeholder for not showing tags                                                                                                                                                                                                                           | slot/function(omittedValues)                                                      | -                                                      |         |                          |
-| multiple                  | Support multiple or not, will be `true` when enable `treeCheckable`.                                                                                                                                                                                       | boolean                                                                           | false                                                  |         |                          |
-| notFoundContent           | Specify content to show when no result matches                                                                                                                                                                                                             | slot                                                                              | `Not Found`                                            |         |                          |
-| placeholder               | Placeholder of the select input                                                                                                                                                                                                                            | string\|slot                                                                      | -                                                      |         |                          |
-| placement                 | The position where the selection box pops up                                                                                                                                                                                                               | `bottomLeft` `bottomRight` `topLeft` `topRight`                                   | bottomLeft                                             | 3.3.0   |
-| replaceFields             | Replace the label,value, key and children fields in treeNode with the corresponding fields in treeData                                                                                                                                                     | object                                                                            | { children:'children', label:'title', value: 'value' } |         | 1.6.1 (3.0.0 deprecated) |
-| searchPlaceholder         | Placeholder of the search input                                                                                                                                                                                                                            | string\|slot                                                                      | -                                                      |         |                          |
-| searchValue(v-model)      | work with `search` event to make search value controlled.                                                                                                                                                                                                  | string                                                                            | -                                                      |         |                          |
-| showCheckedStrategy       | The way show selected item in box. **Default:** just show child nodes. **`TreeSelect.SHOW_ALL`:** show all checked treeNodes (include parent treeNode). **`TreeSelect.SHOW_PARENT`:** show checked treeNodes (just show parent treeNode).                  | enum { TreeSelect.SHOW_ALL, TreeSelect.SHOW_PARENT, TreeSelect.SHOW_CHILD }       | TreeSelect.SHOW_CHILD                                  |         |                          |
-| showSearch                | Whether to display a search input in the dropdown menu(valid only in the single mode)                                                                                                                                                                      | boolean                                                                           | false                                                  |         |                          |
-| size                      | To set the size of the select input, options: `large` `small`                                                                                                                                                                                              | string                                                                            | 'default'                                              |         |                          |
-| status                    | Set validation status                                                                                                                                                                                                                                      | 'error' \| 'warning'                                                              | -                                                      | 3.3.0   |
-| suffixIcon                | The custom suffix icon                                                                                                                                                                                                                                     | VNode \| slot                                                                     | -                                                      |         |                          |
-| tagRender                 | Customize tag render when `multiple`                                                                                                                                                                                                                       | (props) => slot                                                                   | -                                                      | 3.0     |                          |
-| title                     | custom title                                                                                                                                                                                                                                               | slot                                                                              |                                                        | 3.0.0   |                          |
-| treeCheckable             | Whether to show checkbox on the treeNodes                                                                                                                                                                                                                  | boolean                                                                           | false                                                  |         |                          |
-| treeCheckStrictly         | Whether to check nodes precisely (in the `checkable` mode), means parent and child nodes are not associated, and it will make `labelInValue` be true                                                                                                       | boolean                                                                           | false                                                  |         |                          |
-| treeData                  | Data of the treeNodes, manual construction work is no longer needed if this property has been set(ensure the Uniqueness of each value)                                                                                                                     | array\\<{ value, title, children, \[disabled, disableCheckbox, selectable] }>  | \[]                                                    |         |                          |
-| treeDataSimpleMode        | Enable simple mode of treeData. Changes the `treeData` schema to: \[{id:1, pId:0, value:'1', title:"test1",...},...] where pId is parent node's id). It is possible to replace the default `id` and `pId` keys by providing object to `treeDataSimpleMode` | false\|object\\<{ id: string, pId: string, rootPId: null }>                    | false                                                  |         |                          |
-| treeDefaultExpandAll      | Whether to expand all treeNodes by default                                                                                                                                                                                                                 | boolean                                                                           | false                                                  |         |                          |
-| treeDefaultExpandedKeys   | Default expanded treeNodes                                                                                                                                                                                                                                 | string\[] \| number\[]                                                            | -                                                      |         |                          |
-| treeExpandedKeys(v-model) | Set expanded keys                                                                                                                                                                                                                                          | string\[] \| number\[]                                                            | -                                                      |         |                          |
-| treeIcon                  | Shows the icon before a TreeNode's title. There is no default style; you must set a custom style for it if set to `true`                                                                                                                                   | boolean                                                                           | false                                                  |         |                          |
-| treeLoadedKeys            | (Controlled) Set loaded tree nodes, work with `loadData` only                                                                                                                                                                                              | string[]                                                                          | []                                                     | 3.3.0   |
-| treeLine                  | Show the line. Ref [Tree - showLine](/components/tree/#components-tree-demo-line)                                                                                                                                                                          | boolean \| object                                                                 | false                                                  | 3.0     |                          |
-| treeNodeFilterProp        | Will be used for filtering if `filterTreeNode` returns true                                                                                                                                                                                                | string                                                                            | 'value'                                                |         |                          |
-| treeNodeLabelProp         | Will render as content of select                                                                                                                                                                                                                           | string                                                                            | 'title'                                                |         |                          |
-| value(v-model)            | To set the current selected treeNode(s).                                                                                                                                                                                                                   | string\|string\[]                                                                 | -                                                      |         |                          |
-| virtual                   | Disable virtual scroll when set to false                                                                                                                                                                                                                   | boolean                                                                           | true                                                   | 3.0     |                          |
-
-### Events
-
-| Events Name           | Description                                                                        | Arguments                     | Version |
-| --------------------- | ---------------------------------------------------------------------------------- | ----------------------------- | ------- |
-| change                | A callback function, can be executed when selected treeNodes or input value change | function(value, label, extra) |         |
-| dropdownVisibleChange | Called when dropdown open                                                          | function(open)                | 3.0     |
-| search                | A callback function, can be executed when the search input changes.                | function(value: string)       |         |
-| select                | A callback function, can be executed when you select a treeNode.                   | function(value, node, extra)  |         |
-| treeExpand            | A callback function, can be executed when treeNode expanded                        | function(expandedKeys)        |         |
-
-### Tree Methods
-
-| Name    | Description  |
-| ------- | ------------ |
-| blur()  | remove focus |
-| focus() | get focus    |
-
-### TreeNode props
-
-> We recommend you to use `treeData` rather than `TreeNode`, to avoid the trouble of manual construction.
-
-| Property        | Description                                                                      | Type             | Default | Version |
-| --------------- | -------------------------------------------------------------------------------- | ---------------- | ------- | ------- |
-| checkable       | When Tree is checkable, set TreeNode display Checkbox or not                     | boolean          | -       |         |
-| disableCheckbox | Disables the checkbox of the treeNode                                            | boolean          | false   |         |
-| disabled        | Disabled or not                                                                  | boolean          | false   |         |
-| isLeaf          | Leaf node or not                                                                 | boolean          | false   |         |
-| key             | Required property, should be unique in the tree                                  | string \| number | -       |         |
-| selectable      | can be selected                                                                  | boolean          | true    |         |
-| title           | Content showed on the treeNodes                                                  | string           | '---'   |         |
-| value           | Will be treated as `treeNodeFilterProp` by default, should be unique in the tree | string           | -       |         |
-
-## FAQ
-
-### How to get parent node in onChange?
-
-We don't provide this since performance consideration.

package/src/tree-select/index.tsx

@@ -1,364 +0,0 @@
-import type { App, ExtractPropTypes } from 'vue'
-import { computed, defineComponent, ref } from 'vue'
-
-import classNames from '../_util/classNames'
-import omit from '../_util/omit'
-import { flattenChildren } from '../_util/props-util'
-import initDefaultProps from '../_util/props-util/initDefaultProps'
-import type { InputStatus } from '../_util/statusUtils'
-import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils'
-import type { SelectCommonPlacement } from '../_util/transition'
-import { getTransitionDirection } from '../_util/transition'
-import { booleanType, functionType, objectType, someType, stringType } from '../_util/type'
-import type { CustomSlotsType } from '../_util/type'
-import PropTypes from '../_util/vue-types'
-import type { SizeType } from '../config-provider'
-import { useInjectDisabled } from '../config-provider/DisabledContext'
-import useConfigInject from '../config-provider/hooks/useConfigInject'
-import { FormItemInputContext, useInjectFormItemContext } from '../form/FormItemContext'
-// CSSINJS
-import useSelectStyle from '../select/style'
-import getIcons from '../select/utils/iconUtil'
-import { useCompactItemContext } from '../space/Compact'
-import type { TreeProps } from '../tree'
-import type { SwitcherIconProps } from '../tree/utils/iconUtil'
-import renderSwitcherIcon from '../tree/utils/iconUtil'
-import type { BaseSelectRef } from '../vc-select'
-import VcTreeSelect, {
-  SHOW_ALL,
-  SHOW_CHILD,
-  SHOW_PARENT,
-  TreeNode,
-  treeSelectProps as vcTreeSelectProps,
-} from '../vc-tree-select'
-import type { BaseOptionType, DefaultOptionType } from '../vc-tree-select/TreeSelect'
-import type { FieldNames, Key } from '../vc-tree-select/interface'
-import devWarning from '../vc-util/devWarning'
-import { warning } from '../vc-util/warning'
-import useStyle from './style'
-
-const getTransitionName = (rootPrefixCls: string, motion: string, transitionName?: string) => {
-  if (transitionName !== undefined) {
-    return transitionName
-  }
-  return `${rootPrefixCls}-${motion}`
-}
-
-type RawValue = string | number
-
-export interface LabeledValue {
-  key?: string
-  value: RawValue
-  label?: any
-}
-
-export type SelectValue = RawValue | RawValue[] | LabeledValue | LabeledValue[]
-
-export type RefTreeSelectProps = BaseSelectRef
-
-export function treeSelectProps<
-  ValueType = any,
-  OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType,
->() {
-  return {
-    ...omit(vcTreeSelectProps<ValueType, OptionType>(), [
-      'showTreeIcon',
-      'treeMotion',
-      'inputIcon',
-      'getInputElement',
-      'treeLine',
-      'customSlots',
-    ]),
-    suffixIcon: PropTypes.any,
-    size: stringType<SizeType>(),
-    bordered: booleanType(),
-    treeLine: someType<TreeProps['showLine']>([Boolean, Object]),
-    replaceFields: objectType<FieldNames>(),
-    placement: stringType<SelectCommonPlacement>(),
-    status: stringType<InputStatus>(),
-    popupClassName: String,
-    /** @deprecated Please use `popupClassName` instead */
-    dropdownClassName: String,
-    'onUpdate:value': functionType<(value: any) => void>(),
-    'onUpdate:treeExpandedKeys': functionType<(keys: Key[]) => void>(),
-    'onUpdate:searchValue': functionType<(value: string) => void>(),
-  }
-}
-export type TreeSelectProps = Partial<ExtractPropTypes<ReturnType<typeof treeSelectProps>>>
-
-const TreeSelect = defineComponent({
-  compatConfig: { MODE: 3 },
-  name: 'ATreeSelect',
-  inheritAttrs: false,
-  props: initDefaultProps(treeSelectProps(), {
-    choiceTransitionName: '',
-    listHeight: 256,
-    treeIcon: false,
-    listItemHeight: 26,
-    bordered: true,
-  }),
-  slots: Object as CustomSlotsType<{
-    title?: any
-    titleRender?: any
-    placeholder?: any
-    maxTagPlaceholder?: any
-    treeIcon?: any
-    switcherIcon?: any
-    notFoundContent?: any
-    default?: any
-    leafIcon?: any
-    tagRender?: any
-    suffixIcon?: any
-  }>,
-  setup(props, { attrs, slots, expose, emit }) {
-    warning(
-      !(props.treeData === undefined && slots.default),
-      '`children` of TreeSelect is deprecated. Please use `treeData` instead.',
-    )
-    devWarning(
-      props.multiple !== false || !props.treeCheckable,
-      'TreeSelect',
-      '`multiple` will always be `true` when `treeCheckable` is true',
-    )
-    devWarning(
-      props.replaceFields === undefined,
-      'TreeSelect',
-      '`replaceFields` is deprecated, please use fieldNames instead',
-    )
-    devWarning(
-      !props.dropdownClassName,
-      'TreeSelect',
-      '`dropdownClassName` is deprecated. Please use `popupClassName` instead.',
-    )
-
-    const formItemContext = useInjectFormItemContext()
-    const formItemInputContext = FormItemInputContext.useInject()
-    const mergedStatus = computed(() => getMergedStatus(formItemInputContext.status, props.status))
-    const {
-      prefixCls,
-      renderEmpty,
-      direction,
-      virtual,
-      dropdownMatchSelectWidth,
-      size: contextSize,
-      getPopupContainer,
-      getPrefixCls,
-      disabled,
-    } = useConfigInject('select', props)
-    const { compactSize, compactItemClassnames } = useCompactItemContext(prefixCls, direction)
-    const mergedSize = computed(() => compactSize.value || contextSize.value)
-    const contextDisabled = useInjectDisabled()
-    const mergedDisabled = computed(() => disabled.value ?? contextDisabled.value)
-    const rootPrefixCls = computed(() => getPrefixCls())
-    // ===================== Placement =====================
-    const placement = computed(() => {
-      if (props.placement !== undefined) {
-        return props.placement
-      }
-      return direction.value === 'rtl'
-        ? ('bottomRight' as SelectCommonPlacement)
-        : ('bottomLeft' as SelectCommonPlacement)
-    })
-    const transitionName = computed(() =>
-      getTransitionName(
-        rootPrefixCls.value,
-        getTransitionDirection(placement.value),
-        props.transitionName,
-      ),
-    )
-    const choiceTransitionName = computed(() =>
-      getTransitionName(rootPrefixCls.value, '', props.choiceTransitionName),
-    )
-    const treePrefixCls = computed(() => getPrefixCls('select-tree', props.prefixCls))
-    const treeSelectPrefixCls = computed(() => getPrefixCls('tree-select', props.prefixCls))
-
-    // style
-    const [wrapSelectSSR, hashId] = useSelectStyle(prefixCls)
-    const [wrapTreeSelectSSR] = useStyle(treeSelectPrefixCls, treePrefixCls)
-
-    const mergedDropdownClassName = computed(() =>
-      classNames(
-        props.popupClassName || props.dropdownClassName,
-        `${treeSelectPrefixCls.value}-dropdown`,
-        {
-          [`${treeSelectPrefixCls.value}-dropdown-rtl`]: direction.value === 'rtl',
-        },
-        hashId.value,
-      ),
-    )
-
-    const isMultiple = computed(() => !!(props.treeCheckable || props.multiple))
-    const mergedShowArrow = computed(() =>
-      props.showArrow !== undefined ? props.showArrow : props.loading || !isMultiple.value,
-    )
-
-    const treeSelectRef = ref()
-    expose({
-      focus() {
-        treeSelectRef.value.focus?.()
-      },
-
-      blur() {
-        treeSelectRef.value.blur?.()
-      },
-    })
-
-    const handleChange: TreeSelectProps['onChange'] = (...args: any[]) => {
-      emit('update:value', args[0])
-      emit('change', ...args)
-      formItemContext.onFieldChange()
-    }
-    const handleTreeExpand: TreeSelectProps['onTreeExpand'] = (keys: Key[]) => {
-      emit('update:treeExpandedKeys', keys)
-      emit('treeExpand', keys)
-    }
-    const handleSearch: TreeSelectProps['onSearch'] = (value: string) => {
-      emit('update:searchValue', value)
-      emit('search', value)
-    }
-    const handleBlur = (e: FocusEvent) => {
-      emit('blur', e)
-      formItemContext.onFieldBlur()
-    }
-    return () => {
-      const {
-        notFoundContent = slots.notFoundContent?.(),
-        prefixCls: customizePrefixCls,
-        bordered,
-        listHeight,
-        listItemHeight,
-        multiple,
-        treeIcon,
-        treeLine,
-        showArrow,
-        switcherIcon = slots.switcherIcon?.(),
-        fieldNames = props.replaceFields,
-        id = formItemContext.id.value,
-        placeholder = slots.placeholder?.(),
-      } = props
-      const { isFormItemInput, hasFeedback, feedbackIcon } = formItemInputContext
-      // ===================== Icons =====================
-      const { suffixIcon, removeIcon, clearIcon } = getIcons(
-        {
-          ...props,
-          multiple: isMultiple.value,
-          showArrow: mergedShowArrow.value,
-          hasFeedback,
-          feedbackIcon,
-          prefixCls: prefixCls.value,
-        },
-        slots,
-      )
-
-      // ===================== Empty =====================
-      let mergedNotFound
-      if (notFoundContent !== undefined) {
-        mergedNotFound = notFoundContent
-      } else {
-        mergedNotFound = renderEmpty('Select')
-      }
-      // ==================== Render =====================
-      const selectProps = omit(props as typeof props & { itemIcon: any; switcherIcon: any }, [
-        'suffixIcon',
-        'itemIcon',
-        'removeIcon',
-        'clearIcon',
-        'switcherIcon',
-        'bordered',
-        'status',
-        'onUpdate:value',
-        'onUpdate:treeExpandedKeys',
-        'onUpdate:searchValue',
-      ])
-
-      const mergedClassName = classNames(
-        !customizePrefixCls && treeSelectPrefixCls.value,
-        {
-          [`${prefixCls.value}-lg`]: mergedSize.value === 'large',
-          [`${prefixCls.value}-sm`]: mergedSize.value === 'small',
-          [`${prefixCls.value}-rtl`]: direction.value === 'rtl',
-          [`${prefixCls.value}-borderless`]: !bordered,
-          [`${prefixCls.value}-in-form-item`]: isFormItemInput,
-        },
-        getStatusClassNames(prefixCls.value, mergedStatus.value, hasFeedback),
-        compactItemClassnames.value,
-        attrs.class,
-        hashId.value,
-      )
-      const otherProps: any = {}
-      if (props.treeData === undefined && slots.default) {
-        otherProps.children = flattenChildren(slots.default())
-      }
-      return wrapSelectSSR(
-        wrapTreeSelectSSR(
-          <VcTreeSelect
-            {...attrs}
-            {...selectProps}
-            disabled={mergedDisabled.value}
-            virtual={virtual.value}
-            dropdownMatchSelectWidth={dropdownMatchSelectWidth.value}
-            id={id}
-            fieldNames={fieldNames}
-            ref={treeSelectRef}
-            prefixCls={prefixCls.value}
-            class={mergedClassName}
-            listHeight={listHeight}
-            listItemHeight={listItemHeight}
-            treeLine={!!treeLine}
-            inputIcon={suffixIcon}
-            multiple={multiple}
-            removeIcon={removeIcon}
-            clearIcon={clearIcon}
-            switcherIcon={(nodeProps: SwitcherIconProps) =>
-              renderSwitcherIcon(
-                treePrefixCls.value,
-                switcherIcon,
-                nodeProps,
-                slots.leafIcon,
-                treeLine,
-              )
-            }
-            showTreeIcon={treeIcon as any}
-            notFoundContent={mergedNotFound}
-            getPopupContainer={getPopupContainer?.value}
-            treeMotion={null}
-            dropdownClassName={mergedDropdownClassName.value}
-            choiceTransitionName={choiceTransitionName.value}
-            onChange={handleChange}
-            onBlur={handleBlur}
-            onSearch={handleSearch}
-            onTreeExpand={handleTreeExpand}
-            v-slots={{
-              ...slots,
-              treeCheckable: () => <span class={`${prefixCls.value}-tree-checkbox-inner`} />,
-            }}
-            {...otherProps}
-            transitionName={transitionName.value}
-            customSlots={{
-              ...slots,
-              treeCheckable: () => <span class={`${prefixCls.value}-tree-checkbox-inner`} />,
-            }}
-            maxTagPlaceholder={props.maxTagPlaceholder || slots.maxTagPlaceholder}
-            placement={placement.value}
-            showArrow={hasFeedback || showArrow}
-            placeholder={placeholder}
-          />,
-        ),
-      )
-    }
-  },
-})
-
-/* istanbul ignore next */
-export const TreeSelectNode = TreeNode
-export default Object.assign(TreeSelect, {
-  TreeNode,
-  SHOW_ALL: SHOW_ALL as typeof SHOW_ALL,
-  SHOW_PARENT: SHOW_PARENT as typeof SHOW_PARENT,
-  SHOW_CHILD: SHOW_CHILD as typeof SHOW_CHILD,
-  install: (app: App) => {
-    app.component(TreeSelect.name, TreeSelect)
-    app.component(TreeSelectNode.displayName, TreeSelectNode)
-    return app
-  },
-})

package/src/tree-select/index.zh-CN.md

@@ -1,95 +0,0 @@
----
-category: Components
-type: 数据录入
-title: TreeSelect
-subtitle: 树选择
-cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*DfTMRYSDngEAAAAAAAAAAAAADrJ8AQ/original
-coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*Y5pcQLplFu4AAAAAAAAAAAAADrJ8AQ/original
----
-
-树型选择控件。
-
-## 何时使用
-
-类似 Select 的选择控件，可选择的数据结构是一个树形结构时，可以使用 TreeSelect，例如公司层级、学科系统、分类目录等等。
-
-## API
-
-### Tree props
-
-| 参数                      | 说明                                                                                                                                                               | 类型                                                                             | 默认值                                                           | 版本  |                    |
-| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------- | ---------------------------------------------------------------- | ----- | ------------------ |
-| allowClear                | 显示清除按钮                                                                                                                                                       | boolean                                                                          | false                                                            |       |                    |
-| defaultValue              | 指定默认选中的条目                                                                                                                                                 | string/string\[]                                                                 | -                                                                |       |                    |
-| disabled                  | 是否禁用                                                                                                                                                           | boolean                                                                          | false                                                            |       |                    |
-| popupClassName            | 下拉菜单的 className 属性                                                                                                                                          | string                                                                           | -                                                                |       | 4.0                |
-| dropdownMatchSelectWidth  | 下拉菜单和选择器同宽。默认将设置 `min-width`，当值小于选择框宽度时会被忽略。false 时会关闭虚拟滚动                                                                 | boolean \| number                                                                | true                                                             |       |                    |
-| dropdownStyle             | 下拉菜单的样式                                                                                                                                                     | object                                                                           | -                                                                |       |                    |
-| fieldNames                | 替换 treeNode 中 label,value,children 字段为 treeData 中对应的字段                                                                                                 | object                                                                           | {children:'children', label:'title', value: 'value' }            |       | 3.0.0              |
-| filterTreeNode            | 是否根据输入项进行筛选，默认用 treeNodeFilterProp 的值作为要筛选的 TreeNode 的属性值                                                                               | boolean\|Function(inputValue: string, treeNode: TreeNode) (函数需要返回 bool 值) | Function                                                         |       |                    |
-| getPopupContainer         | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。                                                               | Function(triggerNode)                                                            | () => document.body                                              |       |                    |
-| labelInValue              | 是否把每个选项的 label 包装到 value 中，会把 value 类型从 `string` 变为 `{value: string, label: VNode, halfChecked(treeCheckStrictly 时有效): string[] }` 的格式   | boolean                                                                          | false                                                            |       |                    |
-| listHeight                | 设置弹窗滚动高度                                                                                                                                                   | number                                                                           | 256                                                              |       |                    |
-| loadData                  | 异步加载数据                                                                                                                                                       | function(node)                                                                   | -                                                                |       |                    |
-| maxTagCount               | 最多显示多少个 tag                                                                                                                                                 | number                                                                           | -                                                                |       |                    |
-| maxTagPlaceholder         | 隐藏 tag 时显示的内容                                                                                                                                              | slot/function(omittedValues)                                                     | -                                                                |       |                    |
-| multiple                  | 支持多选（当设置 treeCheckable 时自动变为 true）                                                                                                                   | boolean                                                                          | false                                                            |       |                    |
-| notFoundContent           | 当下拉列表为空时显示的内容                                                                                                                                         | slot                                                                             | `Not Found`                                                      |       |                    |
-| placeholder               | 选择框默认文字                                                                                                                                                     | string\|slot                                                                     | -                                                                |       |                    |
-| placement                 | 选择框弹出的位置                                                                                                                                                   | `bottomLeft` `bottomRight` `topLeft` `topRight`                                  | bottomLeft                                                       | 3.3.0 |
-| replaceFields             | 替换 treeNode 中 label,value,key,children 字段为 treeData 中对应的字段                                                                                             | object                                                                           | {children:'children', label:'title', key:'key', value: 'value' } |       | 1.6.1 (3.0.0 废弃) |
-| searchPlaceholder         | 搜索框默认文字                                                                                                                                                     | string\|slot                                                                     | -                                                                |       |                    |
-| searchValue(v-model)      | 搜索框的值，可以通过 `search` 事件获取用户输入                                                                                                                     | string                                                                           | -                                                                |       |                    |
-| showCheckedStrategy       | 定义选中项回填的方式。`TreeSelect.SHOW_ALL`: 显示所有选中节点(包括父节点). `TreeSelect.SHOW_PARENT`: 只显示父节点(当父节点下所有子节点都选中时). 默认只显示子节点. | enum{TreeSelect.SHOW_ALL, TreeSelect.SHOW_PARENT, TreeSelect.SHOW_CHILD }        | TreeSelect.SHOW_CHILD                                            |       |                    |
-| showSearch                | 在下拉中显示搜索框(仅在单选模式下生效)                                                                                                                             | boolean                                                                          | false                                                            |       |                    |
-| size                      | 选择框大小，可选 `large` `small`                                                                                                                                   | string                                                                           | 'default'                                                        |       |                    |
-| status                    | 设置校验状态                                                                                                                                                       | 'error' \| 'warning'                                                             | -                                                                | 3.3.0 |
-| suffixIcon                | 自定义的选择框后缀图标                                                                                                                                             | VNode \| slot                                                                    | -                                                                |       |                    |
-| tagRender                 | 自定义 tag 内容，多选时生效                                                                                                                                        | slot                                                                             | -                                                                | 3.0   |                    |
-| title                     | 自定义标题                                                                                                                                                         | slot                                                                             |                                                                  | 3.0.0 |                    |
-| treeCheckable             | 显示 checkbox                                                                                                                                                      | boolean                                                                          | false                                                            |       |                    |
-| treeCheckStrictly         | checkable 状态下节点选择完全受控（父子节点选中状态不再关联），会使得 `labelInValue` 强制为 true                                                                    | boolean                                                                          | false                                                            |       |                    |
-| treeData                  | treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（value 在整个树范围内唯一）                                                                                 | array<{value, label, children, [disabled, disableCheckbox, selectable]}>      | \[]                                                              |       |                    |
-| treeDataSimpleMode        | 使用简单格式的 treeData，具体设置参考可设置的类型 (此时 treeData 应变为这样的数据结构: \[{id:1, pId:0, value:'1', label:"test1",...},...], `pId` 是父节点的 id)    | false\|Array<{ id: string, pId: string, rootPId: null }>                      | false                                                            |       |                    |
-| treeDefaultExpandAll      | 默认展开所有树节点                                                                                                                                                 | boolean                                                                          | false                                                            |       |                    |
-| treeDefaultExpandedKeys   | 默认展开的树节点                                                                                                                                                   | string\[] \| number\[]                                                           | -                                                                |       |                    |
-| treeExpandedKeys(v-model) | 设置展开的树节点                                                                                                                                                   | string\[] \| number\[]                                                           | -                                                                |       |                    |
-| treeIcon                  | 是否展示 TreeNode title 前的图标，没有默认样式，如设置为 true，需要自行定义图标相关样式                                                                            | boolean                                                                          | false                                                            |       |                    |
-| treeLine                  | 是否展示线条样式，请参考 [Tree - showLine](/components/tree/#components-tree-demo-line)                                                                            | boolean \| object                                                                | false                                                            | 3.0   |                    |
-| treeLoadedKeys            | （受控）已经加载的节点，需要配合 `loadData` 使用                                                                                                                   | string[]                                                                         | []                                                               | 3.3.0 |
-| treeNodeFilterProp        | 输入项过滤对应的 treeNode 属性                                                                                                                                     | string                                                                           | 'value'                                                          |       |                    |
-| treeNodeLabelProp         | 作为显示的 prop 设置                                                                                                                                               | string                                                                           | 'title'                                                          |       |                    |
-| value(v-model)            | 指定当前选中的条目                                                                                                                                                 | string/string\[]                                                                 | -                                                                |       |                    |
-| virtual                   | 设置 false 时关闭虚拟滚动                                                                                                                                          | boolean                                                                          | true                                                             | 3.0   |                    |
-
-### 事件
-
-| 事件名称              | 说明                                   | 回调参数                      | 版本 |
-| --------------------- | -------------------------------------- | ----------------------------- | ---- |
-| change                | 选中树节点或输入值发生变化时调用此函数 | function(value, label, extra) |      |
-| dropdownVisibleChange | 展开下拉菜单的回调                     | function(open)                | 3.0  |
-| search                | 文本框值变化时回调                     | function(value: string)       |      |
-| select                | 树节点被选中时调用                     | function(value, node, extra)  |      |
-| treeExpand            | 展开树节点时调用                       | function(expandedKeys)        |      |
-
-### Tree 方法
-
-| 名称    | 描述     |
-| ------- | -------- |
-| blur()  | 移除焦点 |
-| focus() | 获取焦点 |
-
-### TreeNode props
-
-> 建议使用 treeData 来代替 TreeNode，免去手工构造麻烦
-
-| 参数            | 说明                                               | 类型             | 默认值 | 版本 |
-| --------------- | -------------------------------------------------- | ---------------- | ------ | ---- |
-| checkable       | 当树为 checkable 时，设置独立节点是否展示 Checkbox | boolean          | -      |      |
-| disableCheckbox | 禁掉 checkbox                                      | boolean          | false  |      |
-| disabled        | 是否禁用                                           | boolean          | false  |      |
-| isLeaf          | 是否是叶子节点                                     | boolean          | false  |      |
-| key             | 此项必须设置（其值在整个树范围内唯一）             | string \| number | -      |      |
-| selectable      | 是否可选                                           | boolean          | true   |      |
-| title           | 树节点显示的内容                                   | string\|slot     | '---'  |      |
-| value           | 默认根据此属性值进行筛选（其值在整个树范围内唯一） | string           | -      |      |