如何在redux-form中创建可重用的字段组件？

import React from 'react';
import { Field } from 'redux-form';

const TextInput = ({ input, meta, ...props }) => {
  return (
    <div>
      <input {...input} {...props} />
      {meta.error && meta.touched && <span>{meta.error}</span>}
    </div>
  );
};

const ReusableTextField = (props) => {
  return (
    <Field
      component={TextInput}
      type="text"
      {...props}
    />
  );
};

export default ReusableTextField;

import React from 'react';
import { reduxForm } from 'redux-form';
import ReusableTextField from './ReusableTextField';

const MyForm = (props) => {
  const { handleSubmit } = props;

  const onSubmit = (values) => {
    // 处理表单提交逻辑
  };

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <ReusableTextField name="username" label="Username" />
      <ReusableTextField name="password" label="Password" type="password" />
      <button type="submit">Submit</button>
    </form>
  );
};

export default reduxForm({
  form: 'myForm',
})(MyForm);