亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

重置useState的初始狀態

重置useState的初始狀態

一只斗牛犬 2021-03-28 19:17:28
為了提高我的React技能,我一直在嘗試構建可重用的表單狀態掛鉤和表單驗證器。我的自定義鉤子FormState用空字符串初始化一個對象,該對象的值將用作我的鉤子的初始狀態。我編寫了一個函數clearInputs,我希望將輸入重置為初始狀態,但無法更新。我一直在四處尋找答案,甚至參考此Stack Overflow帖子:使用React Hooks重置為初始狀態。仍然沒有骰子。// MY FORMSTATE HOOKimport { useState } from 'react';const FormState = props => {    let initialState = { ...props };    const [ inputs, setInputs ] = useState(initialState);    const [ errors, setErrors ] = useState(initialState);    const handleInput = e =>        setInputs({            ...inputs,            [e.target.name]: e.target.value        });    const handleError = errs => setErrors({ ...errors, ...errs });    const resetForm = () => {        setInputs({ ...initialState });        setErrors({ ...initialState });    };    const clearInputs = () => {        console.log('SUPPOSED TO CLEAR', initialState)        console.log('MY INPUTS', inputs)        setInputs({ ...initialState });        console.log('AFTER THE SETTING', inputs)    };    return [ inputs, handleInput, errors, handleError, resetForm, clearInputs ];};export default FormState;觸發clearInputs時,應將輸入重置為初始狀態。相反,什么也沒有發生。任何幫助都非常感謝。編輯:讓我進一步澄清。我表單中的每個字段都從輸入(用戶名,密碼1等)傳遞一個值。調用clearInputs時,它會清除鉤子中的輸入,但不會清除Field中的值。
查看完整描述

2 回答

?
慕碼人2483693

TA貢獻1860條經驗 獲得超9個贊

關于為什么登錄不正確,必須理解這一點:每次調用鉤子時(基本上在每個表單渲染器上),都會創建一個新的clearInputs函數,該函數具有其自己的版本inputs。因此,在clearInputs函數本身inputs內部無法更改,因為它們來自作用域中較高的位置,即useState。

如果您想注意到鉤子的兩次調用之間的變化,則可以inputs在返回[inputs,...]之前記錄日志。

同樣,在您的鉤子中,您沒有在調用setInputs,而是定義了一個clearInputs函數,該函數將觸發狀態更改,該函數將重新呈現您的組件,該函數將再次使用您的鉤子,您的鉤子將讀取的新值inputs并創建一個新clearInputs功能。


查看完整回答
反對 回復 2021-04-08
  • 2 回答
  • 0 關注
  • 1558 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號