Flutter'da Bloc / Cubit kullanırken CONTEXT'te dolaşın

Sep 19 2020

Bir süredir flutter yapıyorum ve setState () kullanıyorum. Son zamanlarda BLoC öğrenmeye karar verdi. Şimdi v6'da Bloc, Cubit ile birlikte geliyor, bu yüzden nasıl çalıştıkları ve nasıl uygulanacakları konusunda BLoC-Cubit için eğitimleri takip etmeye başladı. Şimdiye kadar ne öğrendiysem, bir demo projesini hayata geçirdim.

Bu hatayla karşılaştım:

BlocProvider.of (), Cubit türünde bir Cubit içermeyen bir bağlamla çağrıldı.

BlocProvider.of <Cubit> () 'e iletilen bağlamdan başlayarak hiçbir üst öğe bulunamadı.

Bu, kullandığınız bağlam BlocProvider üzerindeki bir widget'tan geliyorsa gerçekleşebilir.

Kullanılan bağlam şuydu: BlocConsumer <Cubit, dynamic> (kirli)

The relevant error-causing widget was BlocConsumer<Cubit<dynamic>, dynamic>bu beni CreateProfile.dart satır no. 3, aşağıya bakın.

Sanırım hata, doğru bağlamı CreateProfile's BlocConsumer'a aktarmadığım bağlamla ilgili. Ancak, Oturum Açma ve Otp sayfalarında Bloc gayet iyi çalışıyor.

Widget ağaçları: Ana-> Sıçrama-> Giriş-> Otp-> CreateProfile gider.

Lütfen bu sorunu çözmeme yardım edin ve benimki uygun değilse blok uygulaması için doğru uygulamayı önerin.

main.dart

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: Splash(),
        routes: {
          Splash.id : (context) => Splash(),
        },
    );
   }
}

Splash.dart

FlatButton(
  onTap: (){
    Navigator.push(context, MaterialPageRoute(builder: (context) => BlocProvider(
      create: (context) => LoginCubit(),
      child: Login(),)));
    },
  child: Text('Get Started', style: kText18SemiBold.copyWith(color: Colors.white)),
),

Login.dart

return Scaffold(
    backgroundColor: kBackgroundColor,
    body: BlocConsumer<LoginCubit, LoginState>(
      listener: (context, state) {
        if(state is LoginApiSuccess){
          Navigator.push(context, MaterialPageRoute(builder: (context) => BlocProvider(
            create: (context) => OtpCubit(),
            child: Otp(),
          )));
        }
      },
      builder: (context, state) {
        return Stack(
          // Contains Login UI 
        )
      }
    )
);

Otp.dart

return Scaffold(
    backgroundColor: kBackgroundColor,
    body: BlocConsumer<OtpCubit, OtpState>(
      listener: (context, state) {
        if(state is OtpApiSuccess){
          Navigator.push(context, MaterialPageRoute(builder: (context) => BlocProvider(
            create: (context) => CreateprofileCubit(),
            child: CreateProfile(),
          )));
        }
      },
      builder: (context, state) {
        return Stack(
          // Contains OTP UI 
        )
      }
    )
);

CreateProfile.dart

return Scaffold(
    backgroundColor: kBackgroundColor,
    body: BlocConsumer<CreateprofileCubit, CreateprofileState>( // Error redirects here
      listener: (context, state) {
        if(state is ProfileCreated){
          Navigator.push(context, MaterialPageRoute(builder: (context) => AddProfileImages(),));
        }
      },
      builder: (context, state) {
        return Stack(
          // Contains CreateProfile UI 
        )
      }
    )
);

Yanıtlar

1 Limbou Sep 19 2020 at 18:23

BlocProvider genel bir sınıftır, ona bir tür sağlamanız gerekir. Değiştirmeyi deneyin:

BlocProvider(
   create: (context) => OtpCubit(),
   child: Otp(),
)

ile:

BlocProvider<OtpCubit>(
   create: (context) => OtpCubit(),
   child: Otp(),
)

Aynı şey kullandığınız diğer tüm BlocProvider'lar için de geçerlidir.