Flutter bloc模式中的state not yield问题

Question

我正在使用flutter_bloc包构建一个基于flutter bloc模式的测试应用程序。问题在于只有Event1的状态被渲染，但是mapEventToState中的代码会执行。我认为问题在于yield语句，因为在触发Event2时，mapEventToState中相应的打印语句会执行。 page_bloc.dart中的mapEventTOState函数。

Stream<PageState> mapEventToState(PageEvent event) async* {
    print(event);
    if (event is Event1) {
      print(">> $event");
      yield State10();
      try {
        await someAsyncFunction();
        yield State11(message: "message");
        print("reached 100");
      } catch (e) {
        yield State12();
      }
    } else if (event is Event2) {
      yield State20();
      try {
        await someAyncFunction2();
        yield State21();
      } catch (e) {
        yield State22(message: e.toString());
      }
    }
    // TODO: implement mapEventToState
  }

page_state.dart 是以下内容:

abstract class PageState extends Equatable {
  @override
  List<Object> get props => [];
}

class State10 extends PageState {}
class State11 extends PageState {}
class State12 extends PageState {}

class State20 extends PageState {}
class State21 extends PageState {}
class State22 extends PageState {}

以下是 page_event.dart 的代码：

abstract class PageEvent extends Equatable {
  @override
  // TODO: implement props
  List<Object> get props => null;
}

class Event1 extends PageEvent {}
class Event2 extends PageEvent {}

是以下内容：

child: BlocBuilder<PageBloc, PageState>(
                    builder: (context, state) {
                      print(state);
                      if (state is State10) {
                        return Text("State10");
                      } else if (state is State11) {
                        return Text("State11");
                      } else if (state is State12) {
                        return Text("State12");
                      } else if (state is State20) {
                        return Text("State20");
                      } else if (state is State21) {
                        return Text("State21");
                      } else if (state is State22) {
                        return Text("State22");
                      }                       
                    },
                  )

在 Scaffold 中，浮动操作按钮的代码如下：

floatingActionButton: FloatingActionButton(
        onPressed: () => pageBlocInstace2..add(Event2()),
        child: Icon(Icons.done),
      ),

脚手架中的另一个小部件如下：

GestureDetector(
        onTap: () => pageBlocInstace1..add(Event1()),
        child: Center(child: Text("Tap to here")));

- Abhijith Konnayil

---

我想帮助你，但是我不明白你在这句话中的意思："The problem is only the states of Event1 are rendered but the code executes in mapEventToState." 以及问题出在哪儿。 - konstantin_doncov

@don-prog 我已经检查了 if 语句内的代码，使用了 print 语句来验证。mapEventToStates 中的 print 语句已经被打印出来了，这意味着事件已经被正确触发。我不确定，但我认为问题可能出在 yield 语句上。 - Abhijith Konnayil

@don-prog 我的问题与这个链接中的问题 https://dev59.com/I7Tma4cB1Zd3GeqP8Y_F 有关系吗？ - Abhijith Konnayil

Answer 1

这个问题是由于两个事件调用了分开的bloc实例导致的。

floatingActionButton: FloatingActionButton(
        onPressed: () => pageBlocInstace..add(Event2()),
        child: Icon(Icons.done),
      ),

GestureDetector(
        onTap: () => pageBlocInstace..add(Event1()),
        child: Center(child: Text("Tap to here")));

- Abhijith Konnayil

---

你救了我的另一天，浪费了一天后，幸运的是我找到了你的答案。我的运气真好，它起作用了。谢谢你。 - Padmaja Rani