在React w Hooks中双向绑定多个输入。

我有两个输入。如果我想将输入值与状态变量绑定,我使用了这样的方法–。

狀態:

 const [message, setMessage] = useState('')
 const [newUser, setNewUser] = useState('')

绑定它们的方法。

 const handleMessageChange = (e) => setMessage(e.target.value)
 const handleUserChange = (e) => setNewUser(e.target.value)

我通过输入的onChange属性来调用这些方法。

我的问题是……我可以使用一个通用的handleChange方法,而不是显式地给每个输入状态对创建一个方法吗?

我可以使用一个通用的handleChange方法,而不是显式地给每个输入状态对创建一个方法吗?如果可以,怎么做?

解决方案:

你可以考虑把这两个变量都存储在 usermessage 一体 {data} 国家持有人,并在 handleChange 只修改状态对象中的相关键


  const [data, setData] = useState({user: "", message: ""})

  const handleChange = e => setData({...data, [e.target.name]: e.target.value})

  <input name="message" value={data.message} onChange={e => handleChange(e)} />
  <input name="user" value={data.user} onChange={e => handleChange(e)} />

给TA打赏
共{{data.count}}人
人已打赏
未分类

如何删除nodejs-express中的特定会话?

2022-9-7 23:50:19

未分类

flutter_bloc 4.0.0如何获取事件属性参数。

2022-9-8 0:00:36

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索