So, I have made a function in Cubit Class it is to get data from API. For now I just can get the data if I pressed a button. I wanna make the function automatically called when the page/screen is open. For your information, this page is the first page that will be launched when user open the app. Here is some of my codes.

class UsersCubit extends Cubit<UsersState> {
  UsersCubit() : super(UsersInitial());

  UserRepository _userRepository = UserRepository();

  void getAllUsers() async{
    emit(UsersLoading());
    try{
      ResponseUsers _data = await _userRepository.getUsers();
      emit(UsersSuccess(_data));
    } catch(e){
      emit(UsersError(e.toString()));
    }
  }
}

class UsersPage extends StatefulWidget {
  const UsersPage({Key? key}) : super(key: key);

  @override
  _UsersPageState createState() => _UsersPageState();
}

class _UsersPageState extends State<UsersPage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Users")),
      body: BlocProvider(
        create: (context) => UsersCubit(),
        child: BlocConsumer<UsersCubit, UsersState>(
          listener: (context, state) {
            if(state is UsersLoading){
              print("getting users ...");
            } else if (state is UsersSuccess){
              print(state.data.users[1].identity!.name);
            } else if (state is UsersError){
              print(state.errorMessage);
            }
          },
          builder: (context, state) {
            return Stack(
              children: [
                (state is UsersSuccess) ? listViewUsers(state.data.users) : progressBar(),
                ElevatedButton(
                  onPressed: (){
                    context.read<UsersCubit>().getAllUsers();
                  },
                  child: Text("GET USERS"),
                )
              ],
            );
          },
        ),
      ),
    );
  }
}

I have tried to call the function directly in initState but when I run the app it returns an error.

  @override
  void initState() {
    context.read<UsersCubit>().getAllUsers();
    super.initState();
  }

error:

Error: Could not find the correct Provider<UsersCubit> above this UsersPage 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 UsersPage is under your MultiProvider/Provider<UsersCubit>.
  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>()),
    ),
  }
  ...

  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) {
        // No longer throws
        return Text(context.watch<Example>()),
      }
    ),
  }

Is there any way to solve this case?

CodePudding user response：

I have solved this case with help from @Ehsan Askari. He suggests me to provide the cubit above the MaterialApp, then I did it. Here is my code now

class AppWidget extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => UsersCubit(),
      child: MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: UsersPage(),
      ),
    );
  }
}

class UsersPage extends StatefulWidget {
  const UsersPage({Key? key}) : super(key: key);

  @override
  _UsersPageState createState() => _UsersPageState();
}

class _UsersPageState extends State<UsersPage> {

  @override
  void initState() {
    context.read<UsersCubit>().getAllUsers();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Users")),
      body: BlocConsumer<UsersCubit, UsersState>(
        listener: (context, state) {
          if(state is UsersLoading){
            print("getting users ...");
          } else if (state is UsersSuccess){
            print(state.data.users[1].identity!.name);
          } else if (state is UsersError){
            print(state.errorMessage);
          }
        },
        builder: (context, state) {
          return (state is UsersSuccess) ? listViewUsers(state.data.users) : progressBar();
        },
      ),
    );
  }
}

CodePudding user response：

Can you try wrapp BlocConsumer inside a Builder ?

import 'package:flutter/material.dart';

class UsersPage extends StatefulWidget {
  const UsersPage({Key? key}) : super(key: key);

  @override
  _UsersPageState createState() => _UsersPageState();
}

class _UsersPageState extends State<UsersPage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Users")),
      body: BlocProvider(
        create: (context) {
          final cubit = UsersCubit();
          cubit.getAllUsers();
          return cubit;
        },
        child: Builder(builder: (context) {
          return BlocConsumer<UsersCubit, UsersState>(
            listener: (context, state) {
              if(state is UsersLoading){
                print("getting users ...");
              } else if (state is UsersSuccess){
                print(state.data.users[1].identity!.name);
              } else if (state is UsersError){
                print(state.errorMessage);
              }
            },
            builder: (context, state) {
              return Stack(
                children: [
                  (state is UsersSuccess) ? listViewUsers(state.data.users) : progressBar(),
                  ElevatedButton(
                    onPressed: (){
                      context.read<UsersCubit>().getAllUsers();
                    },
                    child: Text("GET USERS"),
                  )
                ],
              );
            },
          );
        }),
      ),
    );
  }
}