如何在react-final-form中的自定义组件中的form外部定义表单值

import React from 'react';
import { Form, Field } from 'react-final-form';

const CustomInput = ({ form: { input }, label }) => {
  const { value, onChange, onBlur } = input;
  
  return (
    <div>
      <label>{label}</label>
      <input
        type="text"
        value={value}
        onChange={onChange}
        onBlur={onBlur}
      />
    </div>
  );
};

const initialValues = {
  customField: 'Initial Value',
};

const App = () => {
  const onSubmit = (values) => {
    console.log(values);
  };

  return (
    <Form
      onSubmit={onSubmit}
      initialValues={initialValues}
      render={({ handleSubmit }) => (
        <form onSubmit={handleSubmit}>
          <Field
            name="customField"
            component={CustomInput}
            label="Custom Field"
          />
          <button type="submit">Submit</button>
        </form>
      )}
    />
  );
};

export default App;