如何仅在特定输入为空时禁用按钮？

Question

我试图找到一种仅在特定输入字段仍为空时禁用按钮的方法。我的意思是这个过程只需要几个输入字段，有些只是可选的。

我参加的课程向我们展示了如何禁用按钮，直到每个输入都有效，所以我不确定该怎么做。

这是我的代码，我希望按钮仅在日期为空时禁用。

<form className="place-form" onSubmit={placeSubmitHandler}>
    <Input
    id="date"
    element="input"
    type="date"
    label="Date"
    validators={[VALIDATOR_REQUIRE()]}
    errorText=""
    onInput={inputHandler}
  />

  <Input
    id="description"
    element="textarea"
    label="description"
    validators={[VALIDATOR_MINLENGTH(5)]}
    errorText=""
    onInput={inputHandler}
  />
      

  <Button type="submit" disabled={ formState.isValid  }>
     Sumbit
  </Button>
</form>

Answer 1

你需要在formState.isValid

之前加上Not sign like !

<Button type="submit" disabled={ !formState.isValid  }>
     Sumbit
  </Button>

我已经使用 react-hook-form 准备了一个样本。你可以在这里查看：

工作演示

如何仅在特定输入为空时禁用按钮？

How can I disable a button only if specific Input is empty?

javascript

html

reactjs

button

disable