在react-admin中编辑嵌套的protobuf字段的最好方法？

import React from 'react';
import { TextInput, FormDataConsumer } from 'react-admin';

const NestedProtobufInput = ({ value, onChange }) => {
  // 根据protobuf字段的结构渲染相应的输入组件
  // 例如，如果嵌套字段是一个对象，可以使用TextInput组件来编辑该对象的属性
  return (
    <div>
      <TextInput source={`${value}.nestedField1`} label="Nested Field 1" onChange={onChange} />
      <TextInput source={`${value}.nestedField2`} label="Nested Field 2" onChange={onChange} />
    </div>
  );
};

const convertFormDataToProtobuf = (formData) => {
  // 将react-admin的表单数据转换为protobuf字段的格式
  // 使用protobuf库提供的方法来创建和设置protobuf字段的值
  const protobufData = {
    nestedField1: formData.nestedField1,
    nestedField2: formData.nestedField2,
  };
  return protobufData;
};

const convertProtobufToFormData = (protobufData) => {
  // 将protobuf字段转换为react-admin的表单数据格式
  // 可以根据需要进行转换
  const formData = {
    nestedField1: protobufData.nestedField1,
    nestedField2: protobufData.nestedField2,
  };
  return formData;
};

const EditNestedProtobufField = (props) => {
  return (
    <FormDataConsumer>
      {({ formData, ...rest }) => (
        <NestedProtobufInput
          value={convertProtobufToFormData(formData.nestedProtobufField)}
          onChange={(value) => {
            const protobufData = convertFormDataToProtobuf(value);
            props.input.onChange(protobufData);
          }}
          {...rest}
        />
      )}
    </FormDataConsumer>
  );
};

export default EditNestedProtobufField;