在將資料上傳到 Firestore 資料庫之前，我無法驗證文本表單欄位。Firestore 沒有任何問題，只有我撰寫代碼的方式。
驗證是檢查文本欄位不為null或為空，與Flutter codelab相同。如果文本欄位為空，則應顯示錯誤訊息，并且用戶應保持在同一頁面上，直到文本欄位包含資料。一旦文本欄位有效，資料應該保存到 Firestore，頁面上應該會出現一個快餐欄確認，并且應該將用戶導航到另一個頁面。
使用我撰寫的代碼，用戶導航到新頁面，即使所有文本表單欄位都是空的（無效），也會出現小吃欄訊息。我試圖洗掉額外的代碼，以便更容易查看代碼。在我的表單中，我有三個具有相同驗證規則的文本欄位。任何幫助將不勝感激。謝謝。
我的文本表單欄位：
TextFormField(
labelText: 'Trivia Game Url',
onChanged: (val) {
triviaGameImageURL = val as String;
},
controller: _triviaGameImageURLController,
validator: _triviaGameImageURLValidator,
),
驗證方法：
String? _triviaGameImageURLValidator(value) {
if (value == null || value.isEmpty) {
return 'Image Url is required';
}
return null;
}
用戶點擊按鈕時更新 Firestore 的方法：
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;
});
});
}
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text(SnackBarString.triviaGameCreated),
),
);
Timer(const Duration(seconds: 2), () {
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => const AddTriviaGamePage(),
),
);
});
}
uj5u.com熱心網友回復：
在您的代碼中，小吃欄和導航位于if (form!.validate())塊之外。只需擴展此塊以包含您只想在有效表單上執行的所有內容，并在驗證失敗時顯示一條訊息。
在 Firestore 異步呼叫完成后，小吃欄和導航應該僅在成功保存時發生。我建議不要與 混合async/await，.then這些是相同的。如此簡單的awaitFirestore 方法，將其放在一個try/catch塊中并在成功時執行小吃欄和導航。
uj5u.com熱心網友回復：
您需要將文本欄位包裝在表單小部件中并將表單鍵分配給表單小部件
final GlobalKey<FormState> formKey = GlobalKey<FormState>();
Form(
key: formKey,
child: Column(
children: [
... your text fields
// validate
if (formKey.currentState!.validate()) {
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/433472.html