BusinessTreeSelect - 业务树下拉

与 BusinessSelect 功能一致，区别是 BusinessTreeSelect 处理的是 树形 数据。

只需一次定义, 全页面都能方便使用。

下面是组件的初始化示例：

import { BusinessTreeSelectBuilder } from 'react-admin-kit';

// 定义 type 类型, 方便在使用时有代码提示
type TreeSelectType = 'org';

const BusinessTreeSelect = BusinessTreeSelectBuilder<TreeSelectType>(
  {
    apis: [
      {
        type: 'org',
        api: queryOrgFunction,
      },
    ],
  })

// 在页面中使用
<BusinessTreeSelect type="org" />;

由于处理的是树形数据，因此树形组件没有分页功能。请求接口返回的格式直接为一个对象数组，组件默认读取 name 作为文本显示，id 作为下拉取值。

基本的使用方法

BusinessTreeSelect 是 Antd TreeSelect 的封装，因此组件可以接受 Antd TreeSelect 的所有属性。

公司

请选择公司

级联

• 该例子中部门会根据公司级联。

• 可以使用 queryParams 传参数给请求接口。

公司

请选择

部门

清除缓存

使用clearTreeSelectCache(type: string)方法清除缓存。type 不传时清除所有类型的缓存。

onLoad 事件

当下拉数据加载完成后会触发 onLoad 事件。这个事件对于某些场景非常有用，例如可以用它实现默认选中第一条数据。

请选择

API

BusinessTreeSelectBuilder

属性名	描述	类型	默认值
apis	定义所有的业务下拉;	ApiType[]	[]
defaultProps	默认属性;	TreeSelectProps	{}

ApiType

属性名	描述	类型	默认值
api	获取下拉数据的接口	(params: { [key: string]: any; }) => Promise<any>	'-'
type	树形业务下拉的类型	string	'-'
defaultProps	默认属性, 比 Builder 上的优先级更高	TreeSelectProps	'-'

BusinessTreeSelect

BusinessTreeSelect 类型是 BusinessTreeSelectSelfType 和 TreeSelectProps 的结合。

BusinessTreeSelectSelfType

属性名	描述	类型	默认值
type	业务树下拉类型;	string	(必选)
nodeDisabled	禁用某节点;	((node: any) => boolean)	--
queryParams	查询接口的参数. 用法见示例	Record<string, any>	--
noCache	不缓存数据	boolean	false
onLoad	下拉数据加载完成后的回调;	((options: any) => void)	-