Ввод текста теряет фокус после перехода на многострочный - PullRequest
Новая
       7

Ввод текста теряет фокус после перехода на многострочный

0 голосов
/ 21 сентября 2018

Я использую компоненты Office Fabric UI React и хочу переключить текстовый ввод на многострочный, если пользователь вводит запятую.Я могу заставить эту часть работать, однако, когда вход переключается между однострочным и многострочным входами, он теряет фокус.Так что если вы наберете текстовое поле и наберете запятую, текстовое поле теряет фокус.Я полагаю под капотом, компонент текстового поля из Office Office реагирует на текстовую область вместо ввода, когда я переключаюсь между ними, и фокус остается на замененном вводе и не переключается автоматически на новую текстовую область.Любые идеи, как я могу гарантировать, что текстовое поле сохраняет свой фокус после переключения многострочного?Я попытался установить фокус с элементами ref, но это не работает .. 

export class PhoneNumbers extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      phoneNumber: "",
      isMultipleNumbers: false
    };
    this.numbersInputRef = React.createRef();
    this.handleNumbersChange = this.handleNumbersChange.bind(this);
  }
  handleNumbersChange(event) {
    let numbers = event.target.value;
    this.setState({ isMultipleNumbers: numbers.indexOf(";") > 0 ? true : false });
    this.setState({
      phoneNumber: numbers
    });
  }

  render() {
    return (
      <TextField
        label="Phone Numbers"
        name="phoneNumber"
        value={this.state.phoneNumber}
        onKeyUp={this.handleNumbersChange}
        componentRef={input => (this.numbersInputRef = input)}
        multiline={this.state.isMultipleNumbers}
      />
    );
  }
}

1 Ответ

0 голосов
/ 21 сентября 2018

Добавление пропеллера autoFocus к компоненту решает проблему.Спасибо, изб!

...