javascript - 为什么在onClick之后，我的钩子(Hook)无法更新状态？

我通过以下方式定义了一个在ReactJS中使用UseState Hook的常量：

const [inputValue, setInputValue] = useState("")

通过以下方式为表单使用inputValue：

<form
      data-testid="form"
      onSubmit={e => {
        e.preventDefault();
        setLogFilters({
          queryText: inputValue
 });
      }}
    >

我可以使用以下代码段在表单中输入字符串：

<Input
          name="input1"
          type="text"
          onChange={e => setInputValue(e.target.value)}
/>

我现在有一个按钮，onclick应该清除以下形式的字符串输入：

<Button
        onClick={() => {
          setInputValue("");
}}
>

但是表单保留了原始字符串，并且状态未设置为空字符串。怎么了？为什么钩子无法更新状态？

最佳答案

您的输入字段没有value属性，应如下所示：

<Input
    name="input1"
    type="text"
    value={inputValue}
    onChange={e => setInputValue(e.target.value)}
/>