react函数组件中点击一个input获取他前面所有的input的值

可以通过在函数组件中使用`useRef`来获取所有的input元素，然后在点击事件中遍历所有的input元素获取它们的值。

下面是一个示例代码：

import { useRef } from "react";

function MyComponent() {
  const inputRefs = useRef([]);

  const handleButtonClick = () => {
    const values = inputRefs.current.map((ref) => ref.current.value);
    console.log(values);
  };

  const handleInputRef = (ref) => {
    if (ref && !inputRefs.current.includes(ref)) {
      inputRefs.current.push(ref);
    }
  };

  return (
    <div>
      <input type="text" ref={handleInputRef} />
      <input type="text" ref={handleInputRef} />
      <input type="text" ref={handleInputRef} />
      <button onClick={handleButtonClick}>获取所有input的值</button>
    </div>
  );
}

在上面的代码中，我们定义了一个`inputRefs`引用变量来存储所有的input元素的引用。在每个input元素上都添加了一个`ref`属性，当组件挂载和更新时，`handleInputRef`函数会被调用来将input元素的引用添加到`inputRefs`数组中。在按钮的点击事件中，我们遍历`inputRefs`数组并获取所有input元素的值。