使用flutter_bloc无法读取Json数据

Question

Helo我不能在UI中显示数据，因为我不知道我跳过了哪些步骤，我认为这个步骤很清楚，我只使用简单的函数来获取API，但是数据保存在UI中不会显示，让我们看看下面的代码：

集团

class ListnotesBloc extends Bloc<ListnotesEvent, ListnotesState> {
  Future<Either<String, Notes>> fetchData() async {
    try {
      var response =
          await http.get(Uri.parse('http://108.136.46.147:5000/notes'));

      log('ini isi notes ${Notes.fromJson(jsonDecode(response.body))}');

      return Right(Notes.fromJson(jsonDecode(response.body)));
    } catch (e) {
      return Left('err');
    }
  }

  ListnotesBloc() : super(ListnotesInitial()) {
    on<DataShow>((event, emit) async {
      emit(LoadList());
      var data = await fetchData();
      data.fold((l) => log(l), (r) {
        emit(ListHasData(r));
      });
    });
  }
}

用户界面

class _HomePageState extends State<HomePage> {
  final ListnotesBloc _bloc = ListnotesBloc();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _bloc.add(DataShow());
  }

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => ListnotesBloc(),
      child:
          BlocBuilder<ListnotesBloc, ListnotesState>(builder: (context, state) {
        if (state is ListHasData) {
          log("Ini data diUI${state.notes}");
          return Scaffold(
              floatingActionButton: FloatingActionButton(
                onPressed: () {
                  print(state.notes.data);
                },
              ),
              body: Text(state.notes.toString()));
        } else if (state is LoadList)
          return CircularProgressIndicator();
        else
          return Scaffold(
            body: Center(
              child: Text('No data'),
            ),
          );
      }),
    );
  }
}

有忘记使用区块的步骤吗？有什么不对劲吗？

皮克特错误

Answer 1

1. 您需要更改UI以引用正确的ListnotesBloc实例。
2. 您需要在创建DataShow事件时添加ListnotesBloc事件，以获取数据。

如下所示：

class _HomePageState extends State<HomePage> {

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => ListnotesBloc()..add(DataShow()),
      child:
          BlocBuilder<ListnotesBloc, ListnotesState>(builder: (context, state) {
        if (state is ListHasData) {
          log("Ini data diUI${state.notes}");
          return Scaffold(
              floatingActionButton: FloatingActionButton(
                onPressed: () {
                  print(state.notes.data);
                },
              ),
              body: Text(state.notes.toString()));
        } else if (state is LoadList)
          return CircularProgressIndicator();
        else
          return Scaffold(
            body: Center(
              child: Text('No data'),
            ),
          );
      }),
    );
  }
}