react类组件antd的input组件 中只想拿搜索框最后输入的value而且我有多个输入框每次输入之后拿到一个值 最后拿到所有的值 但是这些输入框是我遍历而来的 而不是输入一个就打印一个
时间: 2024-02-27 21:58:25 浏览: 90
你可以在每个输入框的 `onChange` 事件中将输入的值存储到一个数组中,然后在需要的时候取出数组中最后一个值即可。具体实现可以参考下面的代码:
```jsx
import { Input } from 'antd';
import React, { useState } from 'react';
function MyComponent() {
const [values, setValues] = useState([]);
const handleInputChange = (index, e) => {
const newValues = [...values];
newValues[index] = e.target.value;
setValues(newValues);
};
const handleSearch = () => {
const lastValue = values[values.length - 1];
console.log(lastValue);
// do something with lastValue
};
// 假设有三个输入框
const inputs = [0, 1, 2].map(index => (
<Input key={index} onChange={e => handleInputChange(index, e)} />
));
return (
<div>
{inputs}
<button onClick={handleSearch}>搜索</button>
</div>
);
}
```
在上面的代码中,我们使用了 `useState` 来存储输入框的值,每次输入框的值发生变化时,我们都会将新的值存储到 `values` 数组中。当需要获取最后一个输入框的值时,我们只需要取出 `values` 数组中最后一个元素即可。
阅读全文