react hooks 太多的useState 显得很冗余,有没有什么规整的方法呢?
import React, { useState } from 'react'
export default function Test() {
const [state, setState] = useState({
username: 'admin',
password: '123456',
})
const handleInput = (e, field) => {
setState((prevState) => {
return { ...prevState, [field]: e.target.value }
})
}
const handleLogin = () => {
const { username, password } = state
console.log(username, password)
}
return (
<div>
<div>
<input
value={state.username}
onChange={(e) => handleInput(e, 'username')}
></input>
</div>
<div>
<input
value={state.password}
onChange={(e) => handleInput(e, 'password')}
></input>
</div>
<button onClick={handleLogin}>登录</button>
</div>
)
}
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步