제목이 "react-hook-form의 잘못된 Hook 호출"로 다시 작성되었습니다.
<p>저는 후크 형식에 반응하는 것이 처음이므로 간단한 질문일 수 있습니다. 방금 컨트롤러가 값을 숫자로 사용할 수 없다는 것을 발견했습니다. 이것은 나를 많이 짜증나게 했지만 결국 다음과 같이 설명된 github 문제 #8068에서 해결책을 찾았습니다. 다음과 같이 onChange 함수를 설정하십시오. </p>
<pre class="brush:php;toolbar:false;"><컨트롤러
- 규칙={{ valueAsNumber: true }}
렌더링={({ 필드 }) =>
<입력
- onChange={field.onChange}
+ onChange={(이벤트) => field.onChange(+event.target.value)}
유형="번호"
/>
)}
//></pre>
<p>그래서 조금 수정하여 다음 코드를 얻었습니다. </p>
<pre class="brush:php;toolbar:false;">'react'에서 React, { ChangeEvent } 가져오기
'react-hook-form'에서 { 컨트롤러 } 가져오기
import { getPlaceholder } from './getPlaceholder'
import { IInput } from './types'
const NumberInput: React.FC = ({ 컨트롤, 이름, ...props }) =>
const placeholder = getPlaceholder({ type: "number" });
const numberOnChange = (이벤트: ChangeEvent<HTMLInputElement>) =>
if (event.target.value === '') 반환 null;
+event.target.value를 반환합니다.
}
반품 (
<컨트롤러
컨트롤={컨트롤}
이름={이름}
render={({ 필드: { onChange, ...필드 } }) =>
<입력
{...소품}
{...필드}
유형="번호"
자리 표시자={자리 표시자}
onChange={(이벤트) =>
const 값 = 숫자OnChange(이벤트)
onChange(값)
}}
className="h-[20px] pl-[4px] py-[8px] bg-투명 테두리-b
국경-b-[#646464] 초점:경계-b-[#3898EC] 텍스트-[13px]
text-[#F00] 자리 표시자-[#646464] 개요-없음 m-1 w-full"
/>
)}
/>
)
}
기본 NumberInput 내보내기</pre>
<p>이것은 이론적으로는 작동하지만 실제로는 잘못된 후크 호출 오류가 발생합니다. </p>
