Flutter'da FutureBuilder

Merhaba, sevgili flutter meraklısı!

Future<T>Bugün asenkron verilerin flutter'dan doğru şekilde nasıl gösterileceği hakkında daha fazla şey öğreneceğiz FutureBuilder.

Hepimiz biliyoruz, Future<T>harika. Threads Sunucudan veri çekmek gibi asenkron işleri düşünmeden yapmamızı sağlıyor Deadlocks.

Future<Model> _doCalculation() async {
    // do calculation / computation asynchronously.
    ....
    return Model;
}

FutureBuilder<Model>(
        future: _doCalculationFuture,
        builder: (BuildContext context, AsyncSnapshot<Model> snapshot) {
          if (snapshot.hasData) {
            return DataWidget(snapshot.requireData);
          } else if (snapshot.hasError) {
            return ErrorWidget();
          } else {
            return CircularProgressIndicator();
          }
          return const SizedBox();
        },
      );

Future<T>Verirken dikkatli olmalıyız. FutureBuilder.Genellikle FutureBuilderyöntemin içinde olacağından buildve yöntemin birden çok kez çağrılabileceğini bildiğimizden , içinde buildoluşturmamalıyız .Future<T>

Future<T>Eğer metot içinde oluşturursak , her çağrıldığında buildtekrar yaratılacaktır . buildMuhtemelen istediğin bu değil.

Peki, nerede oluşturulacakfutures?

Bir geleceği yaratmak veya güncellemek için ideal yer, initState, didUpdateWidget, didChangeDependenciesvb. gibi bir parçacığın yaşam döngüsü yöntemleri veya bunun dışındaki herhangi bir yerdir.build.

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  late Future<Model> _doCalculationFuture;

  @override
  void initState() {
    super.initState();
    _doCalculationFuture = _doCalculation();
  }

  Future<Model> _doCalculation() async {
    return await Future<Model>.delayed(
      const Duration(seconds: 2),
      () => Model(),
    );
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<Model>(
      future: _doCalculationFuture,
      builder: (BuildContext context, AsyncSnapshot<Model> snapshot) {
        if (snapshot.hasData) {
          return DataWidget(snapshot.requireData);
        } else if (snapshot.hasError) {
          return ErrorWidget();
        } else {
          return CircularProgressIndicator();
        }
        return const SizedBox();
      },
    );
  }
}

Mutlu kodlama!!