颤动的TextField使用TextEditingController获取文本但为空答案

【问题标题】：flutter TextField get text using TextEditingController but got empty颤动的TextField使用TextEditingController获取文本但为空
【发布时间】：2021-10-28 03:26:00
【问题描述】：

我有两个简单的 TextField 小部件和一个包含提交按钮的自定义“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 -

【问题讨论】：

标签： flutter flutter-layout

【解决方案1】：

在此代码中，您将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,
    ),
  ],
),

【讨论】：

我删除了final，还是不行

【解决方案2】：

为此，您必须使用如下 onChanged() 方法->

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

试试这个对你有帮助，有什么问题可以告诉我？ 更多详情可以查看this。

【讨论】：

但是你能解释一下为什么添加这一行可以解决问题吗？
当您在 TextField 中输入内容时，输入会发生变化，因此应该将其传输到控制器。
我发现用onSubmittd代替onChange更合理。使用onChange时，textfield中的文本每次都会更新，导致光标始终在起始位置。
是的，会更好。