1.字段声明

{title: '单位名称',dataIndex: 'departmentId',align: 'center',width: 100,hideInTable: true,renderFormItem: (item, { defaultRender, ...rest }) => (<ProFormSelectname="departmentId"// label="单位名称"options={hospitaltData}onChange={handleFirstSelectChange}{...rest}/>),},{// title: '设备名称',dataIndex: 'equipmentId',hideInTable: true,renderFormItem: (item, { defaultRender, ...rest }) => (<ProFormSelectname="equipmentId"rules={[{ required: true, message: '请选择设备名称' }]}label="设备名称"options={dataTree}onChange={handleSecondSelectChange}{...rest}/>),},
{title: '部件名称',dataIndex: 'partId',width: 100,align: 'center',// hideInTable: true,renderFormItem: (item, { defaultRender, ...rest }) => (<ProFormSelectname="partId"// label="件名称"options={partData}{...rest}/>),render: (_, record) => {return findNameBypart(record?.partId);},},

2.数据来源

const findAllorganizatioData = async () => {const result = await organizationNameList();const treeData = result.data.map((item: any) => ({value: item.id,label: item.name,}));setHospitaltData(treeData);};const fetchData = async (id: any) => {const result = await findByDepartmentId(id);const treeData = result.data.map((item: any) => ({value: item.id,label: item.name,}));setDataTree(treeData);};const findPartData = async (id: any) => {const result = await equipmentListById(id);const params = result.data[0];const partdata = params.siteDtoList?.map((item: any) => ({value: item.id,label: item.name,}));setPartData(partdata);};

3.监听选择框变化，触发事件

  // 监听第一个选择框的变化const handleFirstSelectChange = (value: any) => {fetchData(value);form.setFieldsValue({ equipmentId: undefined, partId: undefined });};// 监听第一个选择框的变化const handleSecondSelectChange = (value: any) => {findPartData(value);form.setFieldsValue({ partId: undefined });};