Javascript DateTimePicker 与 Reacthookform 的 React 集成不会呈现任何日期

看起来您使用REACT-HOOK-FORM和REACT-DATETIME-PICKER是正确的.您面临的问题可能与日期字段的初始值设置不正确有关.

要解决这个问题，你可以set the initial value for the date field using the defaultValue prop in the Controller.此外，您应该确保传递给DateTimePicker的值是一个Date对象，因为Reaction-DateTime-Picker需要一个日期值.

以下是更新后的代码:

import { Controller, useForm } from 'react-hook-form';
import DateTimePicker from 'react-datetime-picker';
import 'react-datetime-picker/dist/DateTimePicker.css';
import 'react-calendar/dist/Calendar.css';

const Jobs = () => {
  const {
    control,
    register,
    handleSubmit,
    formState: { errors },
  } = useForm();

  const onSubmit = handleSubmit(async ({ firstname, startdate }) => {
    console.log(startdate);
  });

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <div>
        <input id="firstname" name="firstname" type="text" {...register('firstname')} />
      </div>

      <div>
        <Controller
          control={control}
          name="startdate"
          defaultValue={new Date()} // Set the initial value to the current date
          render={({ field: { onChange, value } }) => (
            <DateTimePicker onChange={onChange} value={value ? new Date(value) : null} />
          )}
        />
      </div>
    </form>
  );
};

通过将defaultValue设置为new Date()，日期选取器现在应该显示窗体第一次呈现时的当前日期.另外，确保传递给DateTimePicker的值是使用新日期(值)的Date对象.