Could not find the correct Provider<CounterProvider> above this MyWidget Widget

17 Views Asked by At

Error: Could not find the correct Provider above this MyWidget Widget This happens because you used a BuildContext that does not include the provider of your choice. There are a few common scenarios:

  • You added a new provider in your main.dart and performed a hot-reload. To fix, perform a hot-restart.
  • The provider you are trying to read is in a different route. Providers are "scoped". So if you insert of provider inside a route, then other routes will not be able to access that provider.
  • You used a BuildContext that is an ancestor of the provider you are trying to read. Make sure that MyWidget is under your MultiProvider/Provider. This usually happens when you are creating a provider and trying to read it immediately. For example, instead of:
    Widget build(BuildContext context) {
      return Provider<Example>(
        create: (_) => Example(),
        // Will throw a ProviderNotFoundError, because `context` is associated
        // to the widget that is the parent of `Provider<Example>`
        child: Text(context.watch<Example>().toString()),
      );
    }
    
    consider using builder like so: ```consider using builder like so:
    Widget build(BuildContext context) {
      return Provider<Example>(
        create: (_) => Example(),
        // we use `builder` to obtain a new `BuildContext` that has access to the provider
        builder: (context, child) {
          // No longer throws
          return Text(context.watch<Example>().toString());
        }
      );
    }
    
    

import 'package:flutter/material.dart'; import 'package:provider/provider.dart';

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

class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: MultiProvider( providers: [ ChangeNotifierProvider(create: (context) => CounterProvider()), ChangeNotifierProvider(create: (context) => SettingsProvider()), ], child: CounterWidget(), ), ); } }

abstract class BaseProvider extends ChangeNotifier { double executionSpeed = 1.0;

void updateExecutionSpeed(double speed) { executionSpeed = speed; notifyListeners(); } }

abstract class BaseProvider2 extends BaseProvider { double executionSpeed2 = 1.0;

void updateExecutionSpeed2(double speed) { executionSpeed = speed; notifyListeners(); } }

class CounterProvider extends BaseProvider2 { int _value = 0;

int get value => _value;

void increment() { _value++; notifyListeners(); }

void decrement() { _value--; notifyListeners(); } }

class SettingsProvider extends BaseProvider2 { bool _darkMode = false;

bool get darkMode => _darkMode;

void toggleDarkMode() { _darkMode = !_darkMode; notifyListeners(); } }

class CounterWidget extends StatelessWidget { @override Widget build(BuildContext context) { final counterProvider = Provider.of(context); final settingsProvider = Provider.of(context);

return Scaffold(
  appBar: AppBar(
    title: Text('Counter App'),
  ),
  body: Center(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Text(
          'Count: ${counterProvider.executionSpeed}',
          style: TextStyle(fontSize: 24),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            IconButton(
              icon: Icon(Icons.add),
              onPressed: () {
                counterProvider.increment();
              },
            ),
            IconButton(
              icon: Icon(Icons.remove),
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => MyWidget()),
                );
              },
            ),
          ],
        ),
        Switch(
          value: settingsProvider.darkMode,
          onChanged: (value) {
            settingsProvider.toggleDarkMode();
          },
        ),
        Text('Dark Mode: ${settingsProvider.darkMode ? 'On' : 'Off'}'),
      ],
    ),
  ),
);

} }

class MyWidget extends StatelessWidget { @override Widget build(BuildContext context) { final counterProvider = Provider.of(context); final settingsProvider = Provider.of(context); return Scaffold( appBar: AppBar( title: Text('My Widget'), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( 'Count: ${counterProvider.executionSpeed}', style: TextStyle(fontSize: 24), ), Row( mainAxisAlignment: MainAxisAlignment.center, children: [ IconButton( icon: Icon(Icons.add), onPressed: () { counterProvider.increment(); }, ), IconButton( icon: Icon(Icons.remove), onPressed: () { Navigator.push( context, MaterialPageRoute(builder: (context) => MyWidget()), ); }, ), ], ), Switch( value: settingsProvider.darkMode, onChanged: (value) { settingsProvider.toggleDarkMode(); }, ), Text('Dark Mode: ${settingsProvider.darkMode ? 'On' : 'Off'}'), ], ), ), ); } }

0

There are 0 best solutions below