Flutter上传Firestore数据库前Text Form Field验证失效问题求助

嗨，我一眼就发现问题的症结了！你的createFirestoreTriviaGame方法里，SnackBar的显示和页面跳转逻辑完全在表单验证的条件判断外面——不管form.validate()返回true还是false，这两段代码都会执行，所以哪怕所有输入框都是空的，用户还是会被跳转，还能看到成功提示。

修复后的代码 #

把SnackBar和页面跳转的逻辑移到if (form!.validate())的代码块内部，只有验证通过且数据上传完成后才执行这些操作：

Future<void> createFirestoreTriviaGame() async {
  final form = _formKey.currentState;
  if (form!.validate()) {
    setState(() {
      _isLoading = true;
    });
    String triviaGameID = const Uuid().v4();
    Map<String, dynamic> triviaGameMap = {
      FirebaseString.triviaGameID: triviaGameID,
      FirebaseString.triviaGameImageURL: triviaGameImageURL,
    };
    await firestoreMethods
        .addTriviaGameData(
          triviaGameData: triviaGameMap,
          triviaGameID: triviaGameID,
        )
        .then((value) {
      setState(() {
        _isLoading = false;
      });
      // 验证通过且数据上传完成后，才显示SnackBar并跳转
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(
          content: Text(SnackBarString.triviaGameCreated),
        ),
      );
      Timer(const Duration(seconds: 2), () {
        Navigator.pushReplacement(
          context,
          MaterialPageRoute(
            builder: (context) => const AddTriviaGamePage(),
          ),
        );
      });
    });
  } else {
    // 可选：验证失败时给用户提示
    ScaffoldMessenger.of(context).showSnackBar(
      const SnackBar(
        content: Text('请填写所有必填项！'),
      ),
    );
  }
}

额外优化建议 #

你可以去掉onChanged里的赋值逻辑，直接通过控制器获取输入值，既简洁又能避免不必要的类型转换：

// 修改后的TextFormField
TextFormField(
  labelText: "Trivia Game Url",
  controller: _triviaGameImageURLController,
  validator: _triviaGameImageURLValidator,
),

然后在构建数据Map时直接使用控制器的text属性：

FirebaseString.triviaGameImageURL: _triviaGameImageURLController.text,

这样就能保证只有表单验证通过、数据成功上传后，才会触发成功提示和页面跳转，完全符合你预期的逻辑啦！

内容的提问来源于stack exchange，提问作者Carleton Y