表单必填文本字段(Mailer、Flutter)

Form required text field (Mailer,Flutter)

我向你解释一下我现在正在尝试强制填写信息发送通过邮件发送的信息。

如果可以解释一下,以便我了解将代码添加到我的表单中是如何工作的。

Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Text('Demande'),
  ),
  body: Container(
    color: Color(0xffd8edff),
    child: Column(
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: Card(
            child: Column(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(15.0),
                  child: TextFormField(
                    controller: nomController,
                    decoration: InputDecoration(
                      labelText: 'Nom:',
                    ),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.all(15.0),
                  child: TextFormField(
                    controller: prenomController,
                    decoration: InputDecoration(
                      labelText: 'Prénom:',
                    ),
                    keyboardType: TextInputType.name,
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.all(15.0),
                  child: TextFormField(
                    controller: emailController,
                    decoration: InputDecoration(
                      labelText: 'E-mail:',
                      hintText: 'Ex: john.wilson@domain.gov',
                    ),
                  ),
                ),
                RaisedButton(
                  onPressed: () async {
                    showDialog(
                      context: context,
                      barrierDismissible: false,
                      builder: (BuildContext context) {
                        // return object of type Dialog

您需要用 Form 小部件包裹整个表单。

然后您可以将 GlobalKey<FormState> 传递给 Form 以获得对它的引用,您可以在其他方法中使用它

您应该在 State class 的 initState() 中创建表单密钥(确保您使用的是 StatefulWidget)。

完成此操作后,您可以将 validator 传递给您的 TextFormFieldvalidator 接受字符串,如果输入有效则 returns null,如果输入无效则接受错误消息字符串。

然后,在提交按钮上,您可以调用formKey.currentState.validate()。此方法 returns false 如果任何文本字段未通过其验证器。

例如:

GlobalKey<FormState> _formKey;


@override
void initState() {
    super.initState();
    _formKey = GlobalKey();
}

@override
Widget build(BuildContext context) {
    return Form(key: _formKey, child: Column(
        children: [
            TextFormField(
                validator: (value) {
                    if (value.isEmpty) return 'Please enter a value';
                    else return null;
                },
                controller: ...  // whatever controller you are using
            ),
            FlatButton(
                child: Text('Submit'),
                onPressed: () {
                    if (_formKey.currentState.validate()) {
                      //  if this returns true, all the text fields have got good data (i.e. all fields are non-empty)
                      doSomething();
                    } else {
                      // if the call to validate() returns false, the error messages will appear automatically.
                      // you can run any extra code you need here
                    }
                }
            )
        ]
    ));
}