API からの応答を Formik フォームに書き込むにはどうすればよいですか?
P粉546257913
2023-08-17 17:33:34
<p>Formik への API 応答を記述するにはどうすればよいですか?
フォームに正確に一致するデータを受け取る API があります。複数の setFieldValue 行を使用する代わりに、応答全体を一度に書き込むにはどうすればよいですか? </p>
<pre class="brush:php;toolbar:false;">const form = useFormik({
初期値: {
名前： ""、
ログイン： ""、
について： {
年： ""、
ランク: {
シルバー：本当、
ゴールド: 偽、
グローバル: false
}
}
}
}); // 私の初期フォーム
定数{
価値観、
ハンドル変更、
setFieldValue、
} = フォーム;
useEffect(() => {
if (!isEmpty(projectData)) {
Object?.keys(projectData)?.map((項目: 任意、idx: 番号) => {
const キー: any = Object.keys(item).at(-1);
setFieldValue(キー, アイテム[キー]);
});
}
}, [projectData]); // API レスポンスを設定</pre>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
値が変更されたときに Formik が値を更新できるようにするには、
リーリーenableReinitializeを設定する必要があります。
リーリーuseEffectで一度に値を直接設定することもできます。API から受け取ったデータの構造がフォームの構造と一致する場合は、
setValuesメソッドを使用して状態全体を一度に設定できます。API 応答のデータ構造 (
projectData) がinitialValuesの構造と一致していることを確認してください。すべての値を一度に更新するには、
リーリーsetValuesメソッドを使用します。