2 回答

TA貢獻1780條經驗 獲得超5個贊
從文檔中useState:
與類中的 this.setState 不同,更新狀態變量總是替換它而不是合并它。
如果您使用對象作為useState掛鉤的值,則對其的更新必須替換所有值。
發生的情況是您正在更新login,而不是替換password。所以密碼輸入大概是拋出警告的那個。密碼設置為字符串,然后變為undefined.
解決方案很簡單,在更新之前將以前的狀態值傳播到新對象中:
setState({...state, [e.target.name]: e.target.value});
最佳的變更處理程序也會利用更新程序的功能形式,看起來像這樣:
// Destructure the event for cleaner syntax and avoiding the pitfall of pooled events
const changeHandler = ({ target: {name, value} }) => {
// Use a functional update to ensure we always have the most recent copy of state
setState(prev => ({ ...prev, [name]: value }));
}

TA貢獻1839條經驗 獲得超15個贊
e.target.name
可能是未定義的,因此value={state.login}
作為道具返回undefined
,它將組件切換到非受控狀態。
修復這個:
const loginChangeHandler = (e) => setState({...state, login: e.target.value});
添加回答
舉報