首页 > 解决方案 > 带有控制器的 Flutter TextField 根本不更新该字段

问题描述

我以为我有这个权利,但显然有些不对劲。简单的文本字段,其默认文本由控制器设置为newUser['firstName']. newUser是类型Map<String, Dynamic>

TextField(
    decoration: InputDecoration(labelText: 'First Name'),
    controller: TextEditingController(text: newUser['firstName']), // currently set to "Garrett"
    onChanged: (text) {
        print('TEXT: $text'); // only gives the current value plus the last letter hit, ex. 
        "Garrettr", "Garrettf", etc.

        setState(() {
            newUser['firstName'] = text;
        });

        print('FIRST NAME: ${newUser['firstName']}'); // same as text
    },
),

没有错误,但是当我在字段中键入以更改文本时,没有任何反应,并且newUser['firstName']将等于“Garrette”或“Garrettr”等。正如您在代码中看到的text那样,通过的onChanged似乎并不正确,不知道我做错了什么。

标签: flutterdart

解决方案


由于您有很多字段,因此对您来说最简单的方法是为您的字段创建一个“描述符类”。像这样的东西。

class InputFieldDescriptor {
  final String key;
  final String placeholder;
  final TextEditingController controller;

  InputFieldDescriptor(this.key, this.placeholder, this.controller);
}

class WidgetThatDisplayFields extends StatefulWidget {
  @override
  _WidgetThatDisplayFields createState() => _WidgetThatDisplayFields();
}

class _WidgetThatDisplayFields extends State<WidgetThatDisplayFields> {
  List<InputFieldDescriptor> _descriptors = [
    InputFieldDescriptor("user_name", "User name", TextEditingController()),
    InputFieldDescriptor("email", "Email", TextEditingController()),
    InputFieldDescriptor("password", "password", TextEditingController()),
  ];

  List<Widget> _inputFields() {
    return _descriptors.map((descriptor) {
      return TextField(
          decoration: InputDecoration(labelText: descriptor.placeholder),
          controller: descriptor.controller); // currently set to "Garrett"
    }).toList();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: _inputFields(),
    );
  }

  Map<String, String> _collect() {
    Map<String, String> data = {};
    _descriptors.forEach((descriptor) {
      data[descriptor.key] = descriptor.controller.text;
    });
    return data;
  }
}


推荐阅读