仅在选中复选框时复制表单输入 - React Hook Form

Question

我正在尝试使用两种形式，当复选框被选中时，第二种形式复制第一种形式的输入。

我从 React Hook 表单库中看到这段代码，但是，即使未选中该复选框，第二个表单仍会复制第一个表单的输入。

我一直在尝试修复它，但找不到代码有什么问题。

这里是 CSB：https://codesandbox.io/s/cool-dew-1pvsw?file=/src/Contact.tsx

Copy Form Input

Answer 1

您在复制复选框值时出错。这是代码更新。

const Contact = ({
  email,
  email2,
  checked,
  setChecked
}: {
  email: string;
  email2: string;
  checked: boolean;
  setChecked: (checked: boolean) => void;
}) => {
  const { handleSubmit, register, setValue, watch } = useForm({
    defaultValues: { email: email, email2: email2, checky: checked // 1- Add checkbox to form }
  });
  const onSubmit = (values) => console.log(values);
  const watchEmail = watch("email", email);
  const checkbox = watch("checky", checked); // const checkbox = watch("checkbox", email); you're assiging wrong value to checkbox
......

仅在选中复选框时复制表单输入 - React Hook Form

Copy form input ONLY when checkbox is checked - React Hook Form

forms

typescript

reactjs

react-hook-form