我正在使用 React Hook Form 從輸入中注冊資料,如下所示:
<input
className="block w-full box-border rounded-lg mb-5 text-sm p-[1em] border-[1px] border-gray-400 h-[46.8px]"
id="passwordInput"
{...register('password', { required: true })}
type="password"
/>
在我將帶有 airbnb 規則的 eslint 實施到我的專案中之前,它作業得很好。Eslint 提出不應該使用道具傳播的想法,因為我們可能會使用甚至不必要的道具。
Prop spreading is forbiddeneslintreact/jsx-props-no-spreading
有沒有辦法不使用忽略函式來忽略來自 eslint 的訊息并使用反應鉤子形式的注冊函式而不傳播?
uj5u.com熱心網友回復:
根據檔案,您可以使用它:
const { onChange, onBlur, name, ref } = register('firstName');
// include type check against field path with the name you have supplied.
<input
onChange={onChange} // assign onChange event
onBlur={onBlur} // assign onBlur event
name={name} // assign name prop
ref={ref} // assign ref prop
/>
// same as above
<input {...register('firstName')} />
https://react-hook-form.com/api/useform/register/
編輯:更多輸入
const firstNameReg = register('firstName');
const lastNameReg = register('lastName');
return <><input
onChange={firstNameReg.onChange}
onBlur={firstNameReg.onBlur}
name={firstNameReg.name}
ref={firstNameReg.ref}
/>
<input
onChange={lastNameReg.onChange}
onBlur={lastNameReg.onBlur}
name={lastNameReg.name}
ref={lastNameReg.ref}
/><>;
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/513581.html
上一篇:HTML表單下拉串列和相應的輸入
