setState tuzakları

Async sonrası setState ve mounted kontrolünü öğrenirsin.

Async sonrası setState tuzağı

Bir Future bekledikten sonra setState çağırırsan, widget artık ekranda olmayabilir; kullanıcı başka sayfaya geçmiş olabilir. Bu durumda setState hata fırlatır.

Future.delayed(Duration(seconds: 2), () {
  setState(() { _veri = 'hazır'; });
});

Bunu önlemek için mounted kontrolü yaparsın.

mounted kontrolü

mounted, State nesnesinin o anda widget ağacında olup olmadığını söyler. true iken setState güvenlidir.

if (mounted) {
  setState(() { _veri = sonuc; });
}

dispose çağrıldıktan sonra mounted false olur.

Uygulama Async veri yükle ve mounted ile setState çağır

veriCek metodu 100 ms beklesin. Sonra if (mounted) kontrolü yapıp setState ile _veri'yi 'hazır' yap ve print(_veri) çağır.

Örnek çözümü göster

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: VeriEkrani());
  }
}

class VeriEkrani extends StatefulWidget {
  @override
  _VeriEkraniState createState() => _VeriEkraniState();
}

class _VeriEkraniState extends State<VeriEkrani> {
  String _veri = 'yükleniyor';

  @override
  void initState() {
    super.initState();
    veriCek();
  }

  Future<void> veriCek() async {
    await Future.delayed(Duration(milliseconds: 100));
    if (mounted) {
      setState(() {
        _veri = 'hazır';
      });
      print(_veri);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(child: Text(_veri)),
    );
  }
}

Kendini test et

Async bir işlem sonrası setState'ten önce ne yapılmalı?
- Async bir işlem sonrası setState'ten önce mounted kontrolü yapılır
- mounted yalnızca initState içinde kullanılır
- mounted, State dispose edildikten sonra true olur
- mounted her zaman true'dur
Cevabı göster

Async bir işlem sonrası setState'ten önce mounted kontrolü yapılır — Async sonrası widget ağaçtan çıkmış olabilir; setState'ten önce if (mounted) ile State'in hâlâ ağaçta olduğu kontrol edilir.

mounted kontrolünü ekle

Future<void> veriCek() async {
  await Future.delayed(Duration(seconds: 1));
  if (____) {
    setState(() { _veri = 'hazır'; });
    print(_veri);
  }
}

Cevabı göster

Future<void> veriCek() async {
  await Future.delayed(Duration(seconds: 1));
  if (mounted) {
    setState(() { _veri = 'hazır'; });
    print(_veri);
  }
}

Async ve mounted parçaları

mounted

State'in widget ağacında olup olmadığı
async

Beklenebilen fonksiyonları işaretleyen anahtar kelime
Future.delayed

Belirli süre sonra callback çalıştırır
if (mounted)

Async sonrası setState'in güvenli çağrısı

Sıradaki ders: State ve performans

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler