react-hook-form：如何顯示嵌套名稱的錯誤？

Question

我在 react-hook-form 中有一個register("test.new",{required:true})

現在如何顯示test.new錯誤

{errors.test.new && <p style={{ color: "yellow" }}>This field is required</p>}

不管用

Answer 1

在你輸入任何東西之前，沒有錯誤，所以errors對象沒有任何屬性，你需要添加一個可選的鏈接運算符來安全地獲取嵌套屬性，以防它未定義：

{errors.test?.new && (
  <p style={{ color: 'red' }}>This field is required</p>
)}

現場演示