Как отключить кнопку, пока пользователь не введет ввод, и если он содержит только 5 символов? - PullRequest
Новая
       31

Как отключить кнопку, пока пользователь не введет ввод, и если он содержит только 5 символов?

0 голосов
/ 13 февраля 2020

Я хочу изменить следующий код .. 

<Modal.Body className="modalBody">
    Are you sure you want to unsubscribe?
    <Form>
      <Form.Control
        type="text"
        placeholder="Why do you want to unsubscribe?"
        name="unsubReason"

      />
    </Form>
  </Modal.Body>
  <Modal.Footer className="modalFooter">
    <Button
      onClick={submitUnsubConnection}
      variant="warning"
      style={{ marginTop: 0 }}
      disabled={modalDisabled}
    >
      Yes
    </Button>

home.jsx .... Это компонент класса. 

const validateModal = values => {
  const errors = {};
  const fieldVal = "unsubReason";
  console.log("fieldVal", values.fieldVal);
  //fieldVal.forEach(fieldVal => {
  if (values.fieldVal) {
    // || !/^[a-zA-Z]{5}$/i.test(values.fieldVal)
    this.setState({
      modalDisabled: false
    });
  }
  // });
  return errors;
};

Как это сделать? Я использую этот модал подтверждения в функциональном компоненте и импортирую реквизиты из компонента класса.

1 Ответ

0 голосов
/ 13 февраля 2020

Вы можете управлять двумя состояниями: 1. inputFocus: false, 2. inputValue: ''

Теперь на панели ввода, если фокус пользователя, затем setState inputValue: true И также обновите inputValue и проверьте, меньше ли его длина чем 5 или нет. если больше чем inputFocus false.

...