Как запустить onSubmitted на Flutter для веб-текстового поля

У меня есть небольшое флаттер-приложение для Интернета, и я показываю TextField.

Теперь мне нужен обратный вызов, например onSubmitted, всякий раз, когда пользователь покидает TextField (потеря фокуса) или нажимает клавишу Enter. Сейчас я вообще не могу сделать обратный вызов.

TextField(
  decoration: InputDecoration(
    labelText: 'Name',
  ),
  controller: TextEditingController(text: event.name),
  onEditingComplete: () { print("editing complete"); },
  onSubmitted: (String value) { print("submitted\n"); },
  maxLines: 1,
),

flutter flutter-web
person Fabian    schedule 10.10.2019    source источник
comment
Может попробовать поменять   -  person 0x58    schedule 10.10.2019
comment
Я попробовал этот код, и он работает, проблема может быть в другой части приложения. Не могли бы вы поместить дополнительный код, где вы используете это TextField?   -  person Pablo Barrera    schedule 10.10.2019
comment
@0x58 onchanged срабатывает при каждом нажатии клавиши, кроме Enter или потери фокуса. Но я хочу знать, когда пользователь закончит редактирование, чтобы я мог сохранить новое значение.   -  person Fabian    schedule 10.10.2019
comment
@PabloBarrera, вы запускаете образец в Интернете или на Android / iOS?   -  person Fabian    schedule 10.10.2019
comment
Я пробовал на Android, но с физическим устройством. Возможно, в эмуляторе не работает следующее: github.com/flutter/flutter/issues/ 19027. Но я опубликовал ответ с обходным путем для сети.   -  person Pablo Barrera    schedule 10.10.2019

Ответы (4)


arrow_upward
2
arrow_downward

Это работает для меня на Flutter Web

            TextField(
              controller: _passwordController,
              decoration: InputDecoration(
                labelText: 'Password',
              ),
              obscureText: true,
              onSubmitted: (value) {
                _loginPresenter.login(
                    _usernameController.text, _passwordController.text);
              },
            ),

Обратите внимание на определение onSubmitted. Когда пользователь нажимает клавишу Enter на флаттер-сайте, вызывается метод loginPresenter.login.

person dazza5000    schedule 06.01.2020
comment
Отмечаем это как новое решение сейчас, поскольку упомянутая выше ошибка в флаттере была исправлена ​​некоторое время назад, и нам больше не нужен обходной путь. - person Fabian; 30.10.2020
comment
Это работает для моего настольного приложения, но когда я использую веб-приложение на мобильном устройстве, я не могу вызвать onSubmitted. Какие-либо предложения? - person Daniel S.; 13.04.2021

arrow_upward
1
arrow_downward

Кажется, это проблема: [web]: TextField onSubmitted не запускается при нажатии клавиши ввода

Это обходной путь, упомянутый в ссылке:

    body: RawKeyboardListener(
      focusNode: focusNode,
      onKey: (event) {
        if (event is RawKeyUpEvent && event.data is RawKeyEventDataAndroid) {
          var data = event.data as RawKeyEventDataAndroid;
          if (data.keyCode == 13) {
            debugPrint('onSubmitted');
          }
        }
      },
      child: TextField(),
    ),
person Pablo Barrera    schedule 10.10.2019
comment
Спасибо, что раскопали это! Я как раз и нашел этот баг. Но у меня проблемы с интеграцией обходного пути. Теперь мне удалось получить обработчик событий, но как мне теперь получить доступ к текстовому значению дочернего элемента? См. также мой комментарий к отчету об ошибке. - person Fabian; 10.10.2019
comment
У вас должен быть контроллер, подключенный к TextField, тогда вы можете получить доступ к тексту с помощью controller.text - person Pablo Barrera; 10.10.2019
comment
Как вы можете видеть в примере, который я опубликовал, у меня есть подключенный контроллер, но я, возможно, просто не понимаю, как структурировать программу флаттера. Как мне получить доступ к контроллеру из обработчика событий? - person Fabian; 10.10.2019
comment
Вы должны поместить контроллер в переменную, а затем использовать эту переменную, чтобы прикрепить контроллер к TextField и откуда-то получить текстовое значение. Вы можете инициализировать контроллер в initState() - person Pablo Barrera; 10.10.2019
comment
Хорошо, спасибо, я понял. Несмотря на то, что он добавляет довольно много стандартного кода. Надеюсь скоро исправят :-( - person Fabian; 10.10.2019
comment
@Fabian, каким был твой последний фрагмент кода в конце? Я пытаюсь заставить кнопку ввода Android работать в сети флаттера. - person William Chou; 07.05.2021

arrow_upward
0
arrow_downward

Кроме того, удаление maxLines: 1, похоже, заставляет onsubmit работать. [Сталкивался с той же проблемой на мобильном телефоне]

person mykey    schedule 06.03.2021

arrow_upward
0
arrow_downward

Вы можете попробовать создать метод, в котором вы делаете условие для своего TextEditingController и на основе этого вы можете отправить его в свое TextField.

  • Первый
   final entredTitle = titleController.text;
   final entredAmount = double.parse(amountController.text);
   if (entredTitle.isEmpty || entredAmount <= 0 ){
     return ;
   }
   widget.addTx(entredTitle,entredAmount);
   Navigator.of(context).pop();
 }
  • Второй
 TextField(
                      decoration:  InputDecoration(labelText: 'Amount'),
                      controller: amountController,
                      onSubmitted: (_) => submitData(),
                    ),
person Salah dine Maham    schedule 21.06.2021