Android 在Flatter中，如何使按钮仅在文本表单字段中有某些值时才可单击？

我正在创建一个颤振应用程序，允许用户发布一些数据（执行CRUD操作）。但问题是，即使一些用户没有在文本表单字段中输入任何值（即文本表单为空），并单击Post按钮，firebase中也会创建一个新字段。我希望只有在文本字段中有一些值时，用户才可以单击Post按钮。我尝试了

autovalidateMode

，但它无法解决问题。虽然它显示了错误，但仍然单击了按钮并创建了空白帖子。只有在有数据的情况下，我如何才能使该按钮可点击

import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';

class ButtonFile extends StatefulWidget {
  @override
  _ButtonFileState createState() => _ButtonFileState();
}

class _ButtonFileState extends State<ButtonFile> {
  final db = FirebaseFirestore.instance;
  String newPost;


  final GlobalKey<FormState> _formKey = GlobalKey();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('form'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(children: [
          Form(
            key: _formKey,
            autovalidateMode: AutovalidateMode.onUserInteraction,
            child: TextFormField(
              autovalidateMode: AutovalidateMode.onUserInteraction,
              validator: (_val) {
                if (_val.isEmpty) {
                  return 'Please enter something';
                }
                return null;
              },
              decoration: InputDecoration(
                  border: OutlineInputBorder(), labelText: 'Post'),
              // onChanged: (String post) {
              //   getNewPost(post);
              onChanged: (_val) {
                newPost = _val;
              },
            ),
          ),
          ElevatedButton(
              onPressed: () {
                db.collection('Posts').add({'post': newPost});
                Navigator.pop(context);
              },
              child: Text('Post'))
        ]),
      ),
    );
  }
}

导入“包装：颤振/材料.省道”；
导入“包：cloud_firestore/cloud_firestore.dart”；
类ButtonFile扩展StatefulWidget{
@凌驾
_ButtonFileState createState（）=>_ButtonFileState（）；
}
类_ButtonFileState扩展状态{
final db=FirebaseFirestore.instance；
字符串newPost；
最终的GlobalKey _formKey=GlobalKey（）；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“形式”），
),
主体：填充物(
填充：常数边集全部（16.0），
子项：列（子项：[
形式(
键：_formKey，
autovalidateMode:autovalidateMode.onUserInteraction，
子项：TextFormField(
autovalidateMode:autovalidateMode.onUserInteraction，
验证器：（\u val）{
如果（_val.isEmpty）{
返回“请输入内容”；
}
返回null；
},
装饰：输入装饰(
边框：OutlineInputBorder（），labelText:“Post”），
//一经更改：（串柱）{
//getNewPost（邮政）；
一旦更改：（_val）{
newPost=_val；
},
),
),
升降按钮(
已按下：（）{
db.collection（'Posts'）.add（{'post'：newPost}）；
Navigator.pop（上下文）；
},
子项：文本（'Post'））
]),
),
);
}
}

单击按钮时，使用

if-else

逻辑检查是否有值

 onPressed: () {
      if(newPost!=""){
          db.collection('Posts').add({'post': newPost});
          Navigator.pop(context);
        }
     }

所以我们这里有一个额外的状态变量，名为

\u validate

当运行表单中的

validator（）

时，如果提供给文本区域的值为空，它会将

\u validate

的值设置为true

当用户按下按钮时，会出现一条

if else

语句，该语句将检查

\u validate

状态变量的值，并相应地在firebase中发布文档

导入“包装：颤振/材料.省道”；
导入“包：cloud_firestore/cloud_firestore.dart”；
类ButtonFile扩展StatefulWidget{
@凌驾
_ButtonFileState createState（）=>_ButtonFileState（）；
}
类_ButtonFileState扩展状态{
final db=FirebaseFirestore.instance；
字符串newPost；
bool _validate=false；
最终的GlobalKey _formKey=GlobalKey（）；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“形式”），
),
主体：填充物(
填充：常数边集全部（16.0），
子项：列（子项：[
形式(
键：_formKey，
autovalidateMode:autovalidateMode.onUserInteraction，
子项：TextFormField(
autovalidateMode:autovalidateMode.onUserInteraction，
验证器：（\u val）{
如果（_val.isEmpty）{
设置状态（）{
_验证=真；
});
返回“请输入内容”；
}
返回null；
},
装饰：输入装饰(
边框：OutlineInputBorder（），labelText:“Post”），
//一经更改：（串柱）{
//getNewPost（邮政）；
一旦更改：（_val）{
newPost=_val；
},
),
),
升降按钮(
已按下：（）{
如果（_验证）{
//要显示的错误
//可能是个小吃吧
}否则{
db.collection（'Posts'）.add（{'post'：newPost}）；
Navigator.pop（上下文）；
} 
},
子项：文本（'Post'））
]),
),
);
}
}

但无论用户是否在文本字段中输入一些数据值，这都会禁用按钮。按钮不可单击您说过如何使按钮仅在文本表单字段中有一些值时才可单击？这就是解决方案。很抱歉，现在页面不再工作。调试控制台中显示以下错误，setState（）或者在构建过程中调用markNeedsBuild（）。虽然您的答案不起作用，但仍然非常感谢，因为您的答案给了我灵感，我在下面的代码中对其进行了修改，并且成功了；onPressed:（）{if（newPost.isNotEmpty）{db.collection（'Posts'）。add（{post'：newPost}）；Navigator.pop（上下文）；}否则{return null；}}，我忘了提到这一点。如果您将newPost声明为this

String newPost=“”；

，那么给出的答案将有效。

ElevatedButton(
   onPressed: (newPost != null && newPost.isNotEmpty) 
       ? () {
                db.collection('Posts').add({'post': newPost});
                Navigator.pop(context);
              } 
       : null,
   child: Text('Post'))

import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';

class ButtonFile extends StatefulWidget {
  @override
  _ButtonFileState createState() => _ButtonFileState();
}

class _ButtonFileState extends State<ButtonFile> {
  final db = FirebaseFirestore.instance;
  String newPost;

  bool _validate = false;


  final GlobalKey<FormState> _formKey = GlobalKey();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('form'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(children: [
          Form(
            key: _formKey,
            autovalidateMode: AutovalidateMode.onUserInteraction,
            child: TextFormField(
              autovalidateMode: AutovalidateMode.onUserInteraction,
              validator: (_val) {
                if (_val.isEmpty) {

                  setState(() {
                    _validate = true;                    
                  });

                  return 'Please enter something';
                }
                return null;
              },
              decoration: InputDecoration(
                  border: OutlineInputBorder(), labelText: 'Post'),
              // onChanged: (String post) {
              //   getNewPost(post);
              onChanged: (_val) {
                newPost = _val;
              },
            ),
          ),
          ElevatedButton(
              onPressed: () {

                if (_validate) {
                  // error you would like to display
                  // might be a snackbar
                } else {
                  db.collection('Posts').add({'post': newPost});
                  Navigator.pop(context);
                } 

              },
              child: Text('Post'))
        ]),
      ),
    );
  }
}