Reactjs react hook表单版本7验证错误不起作用

我在使用新的react hook表单版本7时遇到了验证错误问题，我想知道是否有人可以提供帮助（参见下面链接的示例）

在我从v6升级到v7之前，这一切都是正常的。我改变了

register

的使用方式，即

register（'name'，{required:'addthis'}）}

而不是

ref={register（{required:'addthis'}）}

并更新了从formState获取错误的方法，即

const{formState:{errors}}=useForm（）

而不是

const{errors}=useForm（）

我很确定这与我使用受控组件有关，而不仅仅是一个原生html
，但我似乎不太明白

任何帮助都将不胜感激。谢谢。
您刚刚忘记传递道具和输入组件的参考

const Input = React.forwardRef(
  ({ error, id, label, required, ...props }, ref) => {
    return (
      <>
        <label htmlFor={id}>{label}</label>
        <input id={id} required={required} {...props} ref={ref} />
        <span style={{ color: "red" }}>{error}</span>
      </>
    );
  }
);

const Input=React.forwardRef(
（{error，id，label，required，…props}，ref）=>{
返回(
{label}
{错误}
);
}
);

这是您的代码沙盒：谢谢您的回答，很高兴它很简单。我真的很喜欢react hook表单的简单性，希望它不是因为版本bump已经彻底改变了一些东西，让生活变得更加复杂。它实际上需要哪些额外的道具，就像在这个例子中，我们只是传播所有的道具，在我的TeamWorld示例中，我更愿意控制可以传递的内容，也就是说，我不希望传递和添加
className
，并覆盖现有定义的样式。