antd form表单嵌套取值

export interface DefInputProps {
  value?: any;
  label?: string;
  readOnly?: boolean;
  onChange?:(value: any) => void;
}


export const DefInput: React.FC<DefInputProps> = ({
  label,
  value,
  readOnly,
  onChange,
}) => {
  return (
    <>
      <div className={styles.inputContent}>
        <div className={styles.label}>
          <span>{label}</span>
        </div>  
        <Input
          value={value}
          readOnly={readOnly}
          onChange={onChange}
        />
      </div>
    </>
  );
};

export default DefInput;


 <Form.Item label="高度" colon={false}>
   <Space>
     <Form.Item name="width">
       <DefInput label={"W"} readOnly={false}/>
     </Form.Item>
     <Form.Item name="height">
       <DefInput label={"H"} readOnly={false}/>
     </Form.Item>
   </Space>
 </Form.Item>
//自定义组件需要写onChange方法和value即可