Flutter Provider Scope Hataları: Widget Ağacında Erişim Sorunlarını Çözme
Flutter'da Provider kullanırken en yaygın hata, widget ağacında provider'ın scope dışına çıkmasıdır. Mesela bir sayfada tanımladığın provider'ı başka bir widget'tan erişmeye çalışınca 'Error: Could not find the correct Provider above this widget' hatası alırsın.
Sorun şu: Provider'ı tanımladığın yerin altındaki widget'lar ona erişebilir. Ama üstündeki ya da başka bir dal'daki widget'lar göremez. Bunu çözmek için provider'ı ağacın daha üstüne, genelde MaterialApp ya da main'e yakın bir yere koyman gerekir.
İlk sorun: Single provider ile başlarsın.
1class MyApp extends StatelessWidget {2@override3Widget build(BuildContext context) {4return ChangeNotifierProvider(5create: (_) => CounterProvider(),6child: MaterialApp(7home: HomePage(),8),9);10}11}1213class HomePage extends StatelessWidget {14@override15Widget build(BuildContext context) {16// Bu çalışır, provider HomePage'nin altında17final counter = context.watch<CounterProvider>();18return Scaffold(19body: Text('${counter.count}'),20);21}Ama birden fazla provider lazımsa MultiProvider kullan. Bunu yapmazssan ikinci provider'ı ilkinin scope'u dışında tanımlarsın ve hata alırsın.
1class MyApp extends StatelessWidget {2@override3Widget build(BuildContext context) {4return MultiProvider(5providers: [6ChangeNotifierProvider(create: (_) => CounterProvider()),7ChangeNotifierProvider(create: (_) => ThemeProvider()),8ChangeNotifierProvider(create: (_) => UserProvider()),9],10child: MaterialApp(11home: HomePage(),12),13);14}15}İkinci yaygın hata: Nested provider'lar. Alt sayfada kendi provider'ını tanımlıyorsun ama üst sayfa onun scope'unu görmüyor. Çözüm, provider'ı sadece ihtiyaç duyulan yere koy, ama hiyerarşiye uy.
1class HomePage extends StatelessWidget {2@override3Widget build(BuildContext context) {4return Scaffold(5body: ChangeNotifierProvider(6create: (_) => LocalPageProvider(), // Sadece bu sayfa için7child: DetailPage(),8),9);10}11}1213class DetailPage extends StatelessWidget {14@override15Widget build(BuildContext context) {16// LocalPageProvider'a erişebilir, çünkü HomePage'nin altında17final local = context.watch<LocalPageProvider>();18return Text('${local.data}');19}Üçüncü hata: context.read() ile provider'ı erişmeye çalışmak ama widget rebuild olmadığında güncel değer almamak. watch() kullan, değer değişirse otomatik rebuild olur.
1// Yanlış: değişikliği görmez2final counter = context.read<CounterProvider>();34// Doğru: her değişiklikte rebuild5final counter = context.watch<CounterProvider>();Provider'ı ağacın en üstüne koy, MultiProvider ile birden fazla tanımla, watch() ve read()'i doğru yerde kullan. Scope hatası çoğu zaman provider'ın yanlış yükseklikte tanımlanmasından gelir.
0 yorum