flutter TextField получает текст с помощью TextEditingController, но получает пустой

#flutter #flutter-layout

Вопрос:

У меня есть два простых виджета текстового поля и одна пользовательская страница «PublishAction», включая кнопку отправки.

 child: Column(
  children: [
    TextField(
      decoration: const InputDecoration(labelText: "Topic"),
    ),
    TextField(
      decoration: const InputDecoration(labelText: "Context"),
    ),
    PublishAction(
      topic: "flutter/topic",
      message: "Hello World",
    ),
  ],
),

и я пытаюсь использовать TextEditingController для обработки текста, передавая значения в пользовательское «PublishAction», как показано ниже

 final _topicController = TextEditingController();
final _messageController = TextEditingController();

child: Column(
  children: [
    TextField(
      controller: _topicController,
      decoration: const InputDecoration(labelText: "Topic"),
    ),
    TextField(
      controller: _messageController,
      decoration: const InputDecoration(labelText: "Context"),
    ),
    PublishAction(
      topic: _topicController.text,
      message: _messageController.text,
    ),
  ],
),

но на моей странице PublishAction после того, как я распечатал ее, я обнаружил, что оба значения были пустыми

Я пробовал что-то подобное, но это работает довольно хорошо

 child: Column(
  children: [
    TextField(
      controller: _topicController,
      decoration: const InputDecoration(labelText: "Topic"),
      onchange: () {
        print(_topicController.text);
      }
    ),
  ],
),

как мне не получить пустое значение при передаче TextEditingController.text в качестве параметра функции?

Редактировать:

вот как выглядит PublishAction:

 class PublishAction extends StatelessWidget {
  final String topic;
  final String message;

  const PublishAction({
    Key? key,
    required this.topic,
    required this.message,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return FloatingActionButton(
        child: const Icon(Icons.send),
        onPressed: () {
          print("topic - $topic, message - $message");
        });
  }
}

и вывод:

 topic - , message -

Ответ №1:

Для этого вам нужно использовать метод OnChanged (), как показано ниже->

             onChanged: (val) {
              setState(() {
                _topicController.text = val.toString();
              });
            },

Попробуйте это, это поможет вам, и дайте мне знать о любой проблеме?
Для получения более подробной информации вы можете увидеть это.

1. но не могли бы вы объяснить, почему добавление этой строки решит проблему?

2. Когда вы вводите что-то в текстовое поле, ввод изменяется, поэтому его следует передать контроллеру.

3. Я обнаружил, что использование onSubmittd вместо onChange является более разумным. при использовании onChange текст в текстовом поле будет обновляться каждый раз, поэтому курсор всегда находится в начальной позиции.

4. Да, так будет лучше.

Ответ №2:

здесь, в этом коде, вы указываете final значения '' или Empty TextEditingController() , чтобы его нельзя было изменить, поэтому вам нужно выполнить следующее, и это должно сработать,

 TextEditingController _topicController = TextEditingController();
TextEditingController _messageController = TextEditingController();

child: Column(
  children: [
    TextField(
      controller: _topicController,
      decoration: const InputDecoration(labelText: "Topic"),
    ),
    TextField(
      controller: _messageController,
      decoration: const InputDecoration(labelText: "Context"),
    ),
    PublishAction(
      topic: _topicController.text,
      message: _messageController.text,
    ),
  ],
),