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

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

你需要把Not sign like !放在formState.isValid之前

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

我使用react-hook-form 准备了一个示例。你可以在这里查看：

工作演示