html 文本框 初始化,Flutter 文本框初始化时显示默认值

刚开始作Flutter文本框时候，使用的是TextField。彷佛大多数状况下都没有问题。代码形式以下：html

class _FooState extends State {

TextEditingController _controller;

@override

void initState() {

super.initState();

_controller = new TextEditingController(text: '初始化内容');

}

@override

Widget build(BuildContext context) {

return new Column(

children: [

new TextField(

// 当TextField 第一次建立时，controller会包含初始值，

// 当用户修改文本框内容时，会修改controller的值。

controller: _controller,

),

new RaisedButton(

onPressed: () {

// 经过clear()能够清空controller的值。

_controller.clear();

},

child: new Text('清空'),

),

],

);

}

}

问题1:动态建立文本框初始值

通常状况下，直接使用这种方式，没有任何问题。可是如今有一种状况：api

问题1:当页面文本框中的初始值是动态的，从后台获取到的时候，应该怎么办呢？

这种状况下，说明建立TextEditingController时，并不知道文本内容。这个时候若是动态修改controller的话，会报错，根本无法使用。ide

这种状况我根本没遇到过，可是我以为Flutter确定有解决方法。因此我去找了一下Flutter的文档，总算是没有白找，找到了一个(https://api.flutter.dev/flutt... TextFormField。ui

文档中有一句：spa

If a controller is not specified, initialValue can be used to give the automatically generated controller an initial value.

意思就是说，当不指定controller时，initialValue 就能够自动生成controller的初始值。code

既然有解决方案，那么就是修改一下代码便可。orm

class _FooState extends State {

@override

void initState() {

super.initState();

}

@override

Widget build(BuildContext context) {

return new Column(

children: [

new TextFormField(

initialValue: "初始值"

),

],

);

}

}

经过TextFormField这个组件，轻松解决掉这个问题了。htm

问题2: TextField和TextFormField的区别？

问题虽然解决了，可是如今又有另一个问题了：ci

问题2: TextField和TextFormField的区别是什么？何时使用TextField？何时使用TextFormField？

TextFormField：文档

例如制做一个表单，表单中有用户姓名，姓名必须包含@符号。这个时候就须要使用TextFormField这个组件

TextFormField(

autovalidateMode: AutovalidateMode.always, // 开启自动验证

decoration: const InputDecoration(

icon: Icon(Icons.person),

hintText: 'What do people call you?',

labelText: 'Name *',

),

onSaved: (String value) {

// 当用户保存表单时，返回内容。

},

validator: (String value) { // 表单验证

return value.contains('@') ? 'Do not use the @ char.' : null;

},

)

TextField：

例如制做一个显示文本框，框中提示输入文本框中的内容信息。

TextField(

obscureText: true,

decoration: InputDecoration(

border: OutlineInputBorder(),

labelText: 'Password',

),

)

总结：

若是须要使用保存、重置、验证用户输入的状况下，使用TextFormField。

若是只须要简单的捕获用户的输入行为，只须要使用TextField组件便可。

TextFormField须要个Form组件。