错误BlocProvider.of（）使用不包含UserBloc类型的Bloc的上下文调用

Question

谁知道我该怎么办？我制作了一个用户的listview，它应该显示appbar，tabbar用户列表，用户组以及所有用户的列表。

当我不使用模型和存储库而只是将数据手动放在users_page.dart上时，一切都很好，显示了布局。但是，发生idk怎么办。

Answer 1

这是我的UsersBloc：

import 'package:bloc/bloc.dart';
import 'package:merchant/feature/bloc/users/users_event.dart';
import 'package:merchant/feature/bloc/users/users_state.dart';

class UsersBloc
extends Bloc < UsersEvent, UsersState > {
  int currentIndex = 0;

  @override
  UsersState get initialState => UsersLoading();

  @override
  Stream < UsersState > mapEventToState(UsersEvent event) async * {
    if (event is UsersStarted) {
      this.add(UsersTapped(index: this.currentIndex));
    }

    if (event is UsersTapped) {
      this.currentIndex = event.index;
      yield CurrentIndexChanged(currentIndex: this.currentIndex);
      yield UsersLoading();

      if (this.currentIndex == 0) {
        //        String data = await UsersRepository();
        yield UsersListLoaded(text: "UsersList");
      }

      if (this.currentIndex == 1) {
        //        String data = await UsersRepository();
        yield UsersGroupLoaded(text: "UsersGroup");
      }

      if (event is UsersDetailTapped) {
        yield UsersDetailLoaded(text: "UserDetail");
      }
    }
  }
}

这是我的UsersPage：

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:merchant/component/widget/loading_widget.dart';
import 'package:merchant/feature/bloc/users/users_bloc.dart';
import 'package:merchant/feature/bloc/users/users_event.dart';
import 'package:merchant/feature/bloc/users/users_state.dart';
import 'package:merchant/feature/splash_page.dart';
import 'package:merchant/feature/ui/users/users_list_tab.dart';
import 'package:merchant/feature/ui/users/users_group_tab.dart';

class UsersPage extends StatelessWidget {
  final String text;

  const UsersPage(this.text): super();
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Scaffold(
        appBar: AppBar(
          title: Text(
            "Users (UKSW)",
            style: TextStyle(color: Colors.white),
          ),
          bottom: TabBar(
            onTap: (index) => BlocProvider.of < UsersBloc > (context).add(UsersTapped(index: index)),
            isScrollable: true,
            labelColor: Colors.white,
            unselectedLabelColor: Colors.black54,
            tabs: [
              Tab(text: "User List"),
              Tab(text: "User Group"),
            ],
          ),
          actions: [
            IconButton(icon: Icon(Icons.search),
              onPressed: () {}
            )
          ]
        ),
        body: BlocBuilder < UsersBloc, UsersState >

        ( //bloc: BlocProvider.of<UsersBloc>(context),
          builder: (context, state) {
            if (state is UsersLoading) {
              return LoadingWidget(visible: true);
            }
            if (state is UsersListLoaded) {
              return UsersList();
            } else if (state is UsersGroupLoaded) {
              return UsersGroup();
            }
            return SplashPage();
          }
        )
      ));
  }
}

这是我的users_model.dart：

import 'dart:convert';

class UsersModel {
  String name, username;

  UsersModel({
    this.name,
    this.username
  });

  factory UsersModel.fromJson(Map<String, dynamic> json) => UsersModel(
    name: json['name'],
    username: json['username']
  );
}

Answer 2

如果要从BlocProvider.of（context）获取BLoC，则需要在当前上下文顶部的某个位置提供该BLoC。您需要这样的东西：

BlocProvider(
  create: (BuildContext context) => UsersBloc(),
  child: child(),
);

在您的UsersPage的祖先之一中。基本上，您需要从该小部件树中知道从何处获取BLoC实例。通常，我在MaterialApp中编写这些BlocProvider，以确保每个页面在其上下文中都有这些bloc。

Answer 3

您可以尝试在应用程序的根目录中初始化您的bloc吗？

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: BlocProvider< UsersBloc >(
        create: (context) => UsersBloc(),
        child: UsersPage(),
      ),
    );
  }
}

然后在您的UsersPage文件中初始化bloc，并将其分配给变量并在各处使用。

Widget build(BuildContext context) {
 final UsersBloc usersBloc = BlocProvider.of<UsersBloc>(context);
 return DefaultTabController(
 length: 2,
 ... 
 bottom: TabBar(
   onTap: (index) => usersBloc.add(UsersTapped(index: index),
    ...)
 }