提问人：Shebin shamsuddeen 提问时间：9/12/2023 更新时间：9/12/2023 访问量：36
如何在 react 中从同一输入字段输入多个值
How to input multiple values from same input field in react
问：
这是我的代码
const Diagnosis = () => {
const medicine =[]
var [inputs , setInputs] = useState()
const handleChange = (event) => {
setInputs(event.target.value)
};
const handleAdd = () => {
medicine.push(inputs)
};
}
return (
<div className='container'>
<div>
<h1 className='heading'>DIAGNOSIS</h1>
<form>
<label className='label'>
Medicine :<br/>
<input className='input' name='medicine' type='text' placeholder='One medicine at a time' onChange={handleChange} value={inputs}/>
</label><br/>
</form>
<Button variant="contained" onClick={handleAdd}>Add medicine</Button>
</div>
</div>
)
}
它应该的工作方式是，用户在输入字段中输入值，然后单击该输入被推送到药物数组中 但是由于某种原因，一旦用户更改了输入字段，药物数组就会变成空
我无法弄清楚我在这里做错了什么，有没有更好的方法可以将来自同一输入字段的多个输入存储在一个数组中
我已经尝试了我能想到的一切，但无论如何，每当输入字段有任何变化时，药物数组就会突然变空
答：
1赞
Nicholas Tower
9/12/2023
#1
const medicine =[]
每次组件渲染时都会重新创建此局部变量，因此它始终被空数组替换。如果您希望数组在渲染之间保持存在，它应该是一个状态：
const [medicine, setMedicine] = useState([]);
// ...
const handleAdd = () => {
setMedicine(prev => {
return [...prev, inputs];
})
};
上一个：Perl 输入到数组
评论