react-hook-form 7.23.0-next.0

Version 7.23.0-next.0

on Node.js NPM

const App = () => {
  const { control, register, handleSubmit } = useForm<FormValues>({
    defaultValues: {
      test: [{id: 'UUID5678', test: 'data' }] // id will be remained as it match default keyName
    }
  });
  const { fields, append } = useFieldArray({
    control,
    name: 'test',
  });

  return (
    <form>
      {fields.map((field, index) => {
        return <input key={field.id} {...register(`test.${index}.test`)} />;
      })}

      <button
        type={'button'}
        onClick={() => {
          append({
            id: 'UUID1234', // id value will be remained as it match default keyName
            test: '1234',
          });
        }}
      >
        append
      </button>
      <button>submit</button>
    </form>
  );
};