Измените фокус полей с помощью ref - PullRequest
Новая
       11

Измените фокус полей с помощью ref

0 голосов
/ 14 июля 2020

Я пытаюсь переключить фокус при нажатии кнопки, но ничего не происходит. Я работал с официальной реакционной документацией. Мой фрагмент кода:

Я определил ref в конструкторе 

 constructor(props) {
    super(props)
    this.firstInput = React.createRef()
 }

Затем напишите функцию для установки фокуса 

    changeFocus = () => {
       this.firstInput.current.focus()
    }

Затем определил кнопку для вызова функции при нажатии 

  <Button onClick={this.changeFocus}>
    Focus
  </Button>

И, наконец, установил ссылку в компоненте 

<Col className="pr-md-1" md="3">
  <FormGroup>
    <label>Broj računa</label>
    <Input style={{'borderColor':'lightgray', 'fontSize':'14px'}}
           ref={this.firstInput}
           placeholder="Br.računa"
           type="text"
           value={this.state.accountNumber || (header === null ? "" : header.account_number) }
           onChange={this.changeAccountNumber}
    />
   </FormGroup>
  </Col>

1 Ответ

1 голос
/ 14 июля 2020

Я думаю, вы используете reactstrap (для которого требуется innerRef вместо ref), поэтому вам нужны следующие изменения 

innerRef={(input) => { this.firstInput = input }}

и 

   changeFocus = () => {
       this.firstInput.focus()
    }

Это должно работа.

...