Экран флаттера не меняется после изменения состояния провайдера

Question

Я новичок в флаттере и пытаюсь понять концепцию управления состоянием флаттера с использованием провайдера. Это сценарий изображения, который я пытаюсь сделать

Я создал файл с именем auth_provider.dart в папке с именем Providers.

      class AuthProvider with ChangeNotifier{
    
    bool isLogin = false;

    Future createUser() async
    {
        isLogin = true; 
        notifyListeners();
    }

    Future login() async
    {
        isLogin = true; 
        notifyListeners();
    }

    void logout()
    {
        isLogin = false; 
        notifyListeners();
    }
}

Это кнопка регистрации, которую я создал на странице входа.

      TextButton(
    onPressed: () {
        Navigator.push(
            context,
            MaterialPageRoute(
                builder: (context) => const SignupPage()
            ),
        );
    },
    child: const Text(
        'Signup Button',
    ),
)

Это кнопка регистрации на экране регистрации

      child: ElevatedButton(
    onPressed: () => signUpSubmit(),
    child: const Text(
        'Sign Up',
    ),
),

Я написал будущее signUpSubmit, как показано ниже.

      Future<void> signUpSubmit() async {
    Provider.of<AuthProvider>(context, listen: false).createUser();
}

Я использовал потребителя AuthProvider на странице main.dart.

      class MyApp extends StatelessWidget {
    const MyApp({Key? key}) : super(key: key);
    @override
    Widget build(BuildContext context) {
        return MultiProvider(
            providers: [
                ChangeNotifierProvider(
                    create: (context) => AuthProvider(),
                ),
            ],

            child: Consumer<AuthProvider>(
                builder: (ctx,auth,child){
                    print(auth.isLogin);
                    return MaterialApp(         
                        home: auth.isLogin ? const HomeScreen():const LoginPage(),
            
                        routes: {
                            HomeScreen.routeName: (ctx) => const HomeScreen(),
                            SignupPage.routeName: (ctx) => const SignupPage(),
                            LoginPage.routeName: (ctx) => const LoginPage(),
                        },
                    );
                }      
            ),
        );
    }
}

После нажатия кнопки регистрации я получаю истину на главной странице, которую я распечатал в разделе Consumer Builder на странице main.dart. Таким образом, согласно домашней странице состояния виджета MaterialApp, она должна перенаправляться на HomeScreen, но она не движется. Почему он не движется? Какова основная причина и как лучше всего решить эту проблему?

Примечание. Если я попробую это с экрана входа в систему, перенаправление работает нормально. Но согласно моему потоку изображений (Вход -> регистрация) это не работает.

Answer 1

Основная причина вашей проблемы заключается в том, что вы отправляете новый маршрут (экран) со страницы входа, и лучший способ решить проблему — вывести этот маршрут (экран) из sigupPage.

При нажатии кнопки «Регистрация» на странице входа вы отправляете новый маршрут, поэтому для перенаправления на HomeScreen с SignupPage сначала вам нужно открыть этот маршрут, чтобы вы могли видеть обновленные изменения.

      Future<void> signUpSubmit() async {
    Navigator.of(context).pop();
    Provider.of<AuthProvider>(context, listen: false).createUser();
  }

https://docs.flutter.dev/cookbook/navigation/navigation-basics