React中如何获得函数组件input的value值

在React函数组件中，获取`<input>`元素的`value`值通常通过`state`或`props`来实现。如果你想要从函数组件内部获取`input`的值，你需要定义一个状态(state)来存储它，比如`useState`或`useReducer`。下面是一个例子：

import React, { useState } from 'react';

function MyInputForm() {
  const [inputValue, setInputValue] = useState('');

  const handleChange = (e) => {
    setInputValue(e.target.value);
  };

  return (
    <form>
      <input type="text" value={inputValue} onChange={handleChange} />
      {/* 其他组件 */}
    </form>
  );
}

export default MyInputForm;

在这个例子中，`inputValue`就是我们获取`input`元素值的地方，每当`input`的值发生变化时，`handleChange`函数会更新`inputValue`。

如果你想从外部组件传递`value`到内嵌的函数组件，你可以使用`props`接收：

function ParentComponent() {
  const inputValue = '初始值'; // 或者动态获取

  return (
    <MyInputForm value={inputValue} />
  );
}

export default ParentComponent;

在这里，`MyInputForm`组件接收到`value` prop，并可以使用它。