react-hook-form 中的错误消息有问题

Question

我正在寻求实施 React Hook 错误消息 v7，但我在样式方面遇到了一些问题。我试图使错误消息看起来像文档中的错误消息 (https://codesandbox.io/s/react-hook-form-v7-errormessage-jufsl?file=/src/index.js)，但它似乎不起作用，而且它一直出现两次。下面是我的代码片段：

    <form onSubmit={handleSubmit(onSubmit)} id="contactform">
      <input
        type="text"
        placeholder="Name"
        name="name"
        {...register("name", {
          required: "Name is Required",
          minLength: {
            value: 3,
            message: "Please enter your name"
          }
        })}
      />
    <ErrorMessage errors={errors} name="name" as="p" />
    <ErrorMessage
      errors={errors}
      name="name"
      render={({ message }) => <p>{message}</p>}
     />
      <input
        type="tel"
        placeholder="Mobile Number"
        name="mobile"
      />
/form

谢谢！

Answer 1

出现两次是因为你调用了两次组件

你必须删除

<ErrorMessage
  errors={errors}
  name="name"
  render={({ message }) => <p>{message}</p>}
/>

react-hook-form 中的错误消息有问题

Trouble with error message in react-hook-form

forms

error-handling

reactjs

react-hook-form