dart 使用TextEditingController在文本小部件中实时更改

nzkunb0c  于 2022-12-06  发布在  其他
关注(0)|答案(1)|浏览(137)

我正在学习Flutter,现在尝试监视TextEditingController上的变化。我可以使用侦听器函数监视它,但我不能在Text小部件中使用变量:

class _TestPageState extends State<TestPage> {
  var _textName = "";
  final _textNameController = TextEditingController();

  void _nameChanged() {
    _textName = _textNameController.text;
    print(
        "text controller changed to '${_textNameController.text}' ($_textName)");
  }

  @override
  void initState() {
    super.initState();
    _textNameController.addListener(_nameChanged);
  }

  @override
  void dispose() {
    _textNameController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            IconButton(
              icon: Icon(
                Icons.ac_unit,
                size: 50,
              ),
              onPressed: () => Navigator.pop(context),
            ),
            TextFormField(
              controller: _textNameController,
              // onChanged: (value) {
              //   _textName = _textNameController.text;
              // },
              decoration: InputDecoration(
                hintText: 'description',
              ),
            ),
            Text("text is ${_textName}"),
          ],
        ),
      ),
    );
  }
}

正如你所看到的,我尝试过使用一个侦听器并更改一个变量的值,然后在Text字段中使用该变量。然后使用一个onChanged函数。除了在源代码中进行更改和flutter热重新加载外,Text小部件没有任何更改。看起来Text是常量,但如何做到呢?
不过,侦听器的输出字符串显示的是正确的字符串。
如何使用TextEditingController实时更改Text字段?我看不到什么?

rryofs0p

rryofs0p1#

您需要调用setState来更新用户界面。

void _nameChanged() {
    _textName = _textNameController.text;
    print(
        "text controller changed to '${_textNameController.text}' ($_textName)");

    setState(() {});
  }

相关问题