在React中将两个输入名称导入到数组中,可以通过以下步骤实现:
以下是一个示例代码:
import React, { useState } from 'react';
const NameInput = () => {
const [names, setNames] = useState([]);
const handleInputChange = (e) => {
// 更新输入的名称到状态中
setNames([...names, e.target.value]);
};
const handleAddNames = () => {
// 将输入的名称导入到数组中
// 可以在这里进行其他处理,如清空输入框等
console.log(names);
};
return (
<div>
<input type="text" onChange={handleInputChange} />
<input type="text" onChange={handleInputChange} />
<button onClick={handleAddNames}>添加名称</button>
</div>
);
};
export default NameInput;
在上述示例中,我们使用useState钩子函数来管理状态,通过setNames方法更新状态。在输入框的onChange事件中,调用handleInputChange函数将输入的名称保存到状态中。在按钮的onClick事件中,调用handleAddNames函数将输入的名称导入到数组中,并在控制台打印数组内容。
这是一个简单的示例,你可以根据实际需求进行修改和扩展。
领取专属 10元无门槛券
手把手带您无忧上云