React Admin KitReact Admin Kit
  • 简介
  • 组件
  • 更新日志
⌘ K
核心组件
SchemaForm - JSON 表单
ModalForm - 弹窗表单
ProTable - 高级表格
衍生组件
BusinessSelect - 业务下拉
BusinessTreeSelect - 业务树下拉
Button - 按钮
LinkButton - 链接按钮
FormUpload - 表单上传
默认设置
SettingProvider - 默认设置
最后更新时间:
帮助改进此文档
Copyright © 2025 | Powered by dumi

TABLE OF CONTENTS

‌
‌
‌
‌

BusinessTreeSelect - 业务树下拉

与 BusinessSelect 一样, 可以将系统里所有的树下拉都定义到一起. 只需一次定义, 全页面都能方便使用.

先初始化组件.

import { BusinessTreeSelectBuilder } from 'react-admin-kit';
// 定义 type 类型
type TreeSelectType = 'org';
const BusinessTreeSelect = BusinessTreeSelectBuilder<TreeSelectType>(
{
apis: [
{
type: 'org',
api: queryOrgFunction,
},
],
})
// 在页面中使用
<BusinessTreeSelect type="org" />;

基本的使用方法

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

  • 和BusinessSelect一样, 同样支持queryParams, 可以传入请求参数.

  • 数据同样会默认缓存.

  • BusinessTreeSelect可以透传 Antd TreeSelect 的所有属性.

清除缓存

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

onLoad 事件

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

API

BusinessTreeSelectBuilder

属性名描述类型默认值
apis定义所有的业务下拉;ApiType[][]
defaultProps默认属性;Omit<BusinessTreeSelectProps<string>, "type">{}

ApiType

属性名描述类型默认值
api获取下拉数据的接口(params: { [key: string]: any; }) => Promise<any>'-'
type下拉选择的名字string'-'
defaultProps默认属性, 优先级更高Omit<BusinessTreeSelectProps<string>, "type">'-'

BusinessTreeSelect

属性名描述类型默认值
type类型;string(必选)
nodeDisabled禁用某节点;(node: any) => boolean--
labelKeylabel的默认读取字段string'name'
valueKeyvalue的默认读取字段string'id'
queryParams查询接口的参数. 用法见示例Record<string, any>--
noCache不缓存数据booleanfalse
onLoad下拉数据加载完成后的回调;(options: any) => void-
请选择
请选择