FutureBuilder Hata Durumu

Coddy'nin Flutter Journey'sinin Veri ve Ağ bölümünün bir parçası. Ders 13 / 27.

FutureBuilder hataları senin için yakalar. Future hata fırlattığında hiçbir şey çökmez: oluşturucu, snapshot.hasError değeri true olarak ayarlanmış ve snapshot.error fırlatılan hatayı tutar durumdayken yeniden çalışır.

Böylece her yükleme ekranının üç durumu olur ve oluşturucu bunların her birini ele alır:

if (snapshot.hasError) {
  return Text('Could not load: ${snapshot.error}');
}
if (snapshot.hasData) {
  return Text(snapshot.data!);
}
return const CircularProgressIndicator();

Hata, veri ve hâlâ yükleniyor durumu. Yalnızca veriyi bilen bir oluşturucu, çağrı başarısız olduğunda yükleme simgesini sonsuza kadar gösterir; çünkü hiçbir zaman veri gelmez.

Her denetimi, onu gizleyecek return ifadesinden önce koy. Yükleme simgesinin return ifadesi önce gelirse (“veri yok” durumu için), altındaki hata satırı hiçbir zaman çalışamaz.

Önizlemede başarısız olduğunu görmek için main işlevinin ilk satırı olarak offline = true; yaz ve Çalıştır'a bas. offline, api.dart dosyasından gelir: Her çağrının, telefonda sinyal yokmuş gibi başarısız olmasına neden olur. Denetle'ye basmadan önce bu satırı kaldır.

Görev

Orta

Bağlantı yokken bu ekran sonsuza kadar dönüp durur. Oluşturucuya hata durumunu ekle: snapshot.hasError olduğunda Could not load: metnini, ardından snapshot.error değerini 20 boyutunda göster.

Kendin dene

import 'package:flutter/material.dart';

import 'api.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MessageScreen(),
    );
  }
}

class MessageScreen extends StatefulWidget {
  const MessageScreen({super.key});

  @override
  State<MessageScreen> createState() => _MessageScreenState();
}

class _MessageScreenState extends State<MessageScreen> {
  late Future<String> _message;

  @override
  void initState() {
    super.initState();
    _message = fetch('/message');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: FutureBuilder<String>(
          future: _message,
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return Text(snapshot.data!, style: const TextStyle(fontSize: 24));
            }
            return const CircularProgressIndicator();
          },
        ),
      ),
    );
  }
}