useForm
formを作る時に使う最も基本的なhooks
できることが多い
useForm()の引数でいくつかのoptionsを設定できる
useForm()の返り値として色々返ってくる
型
useForm<FormData>()
返り値
unregister
formの状態をsubscribeして、errorの内容とかが見れる
呼び出す場所とかのルールが色々あるのでdocsを見たほうがいいmrsekut.icon*3
例えばこういう書き方はしてはいけない
code:NG.ts
return <button disabled={!formState.isDirty || !formState.isValid} />;
submitする時に使う
これも色々ルールがあるのでdocs見たほうがいいmrsekut.icon*4
reset
全てのfieldをresetする
引数に与えられたrecordをセットする
これも色々ルールがあるのでdocs見たほうがいいmrsekut.icon*4
resetField
個々のfieldをresetする
setValue
valueをset
ルールが割とある
実行時に再renderingを引き起こすかどうかは条件がある
基本的には引き起こされない、という認識で良い
errorがある時や、formState.isDirty == trueにしたときは、引き起こされる
引数に{ shouldValidate: true }を指定すれば、validationされる
triggerしているのと同じ感じになる
これを指定しないとvalidationされない
rootから再renderingされてるっぽい
When an error is triggered by a value updateと書いてるので、なくてもtriggerされるはずなんだけどされない、よくわからんmrsekut.icon
recordをまるごとsetするにはどうしたらいいか？
reset(fields)を使う
名前がわかりにくいよねmrsekut.icon
setFocus
fieldにfocusする
control
getFieldState
v7.25で入った
isDirty、isTouched、errorなどを返す
setError
手動でerrorを指定する
clearErrors
errorを消す
trigger
手動でvalidationをtriggerさせる
配列を渡すことで、指定したfieldだけtriggerできる
rootから再renderingされてる
他のfieldの内容に依存するvalidationを作る時に便利？
options
defaultValues
初期値
なんか色々書いているので読もうmrsekut.icon*3
shouldUnregister
shouldUseNativeValidation
false,
delayError
undefined
validation関連のoptions
mode
どのタイミングでvalidationをするかを指定する
e.g. onSubmit, onChange, onTouched
reValidateMode
onSubmitの実行後、errorが出ている状態でのmode
どのタイミングでvalidation errorを更新するかを指定する
選択肢はmodeとほぼ同じ
これ、modeと分けてるんだmrsekut.icon
resolver
外部ライブラリを用いてvalidationする
shouldFocusError
validarion errorがある状態でsubmitした時に、errorがあるfieldにfocusさせる
criteriaMode
一つのfieldに複数のvalidation ruleを指定できるが、それを全部収集するか1つ目だけを収集するか
context
resolver関連のなにか