Flutter Bloc Pattern-流事件后如何导航到另一个屏幕?

时间:2018-07-28 03:56:07

标签: dart flutter dart-async reactive-streams

我的问题是与bloc模式一起使用的Navigation。

在我的LoginScreen小部件中,我有一个按钮,可将事件添加到集团的EventSink中。团体调用API并验证用户身份。 问题是我必须在LoginScreen窗口小部件中的哪个位置收听流,以及返回成功状态后如何导航到另一个屏幕。

希望我能说清楚。谢谢!

4 个答案:

答案 0 :(得分:6)

导航器在blocBuilder中不起作用,因为在blocBuilder中,您只能返回小部件

但是BlocListener为我解决了它。

添加此代码:

BlocListener(
  bloc: _yourBloc,
  listener: (BuildContext context, YourState state) {
    if(state is NavigateToSecondScreen){
      Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context) {return SecondScreen();}));
    }
  },
  child: childWidget
)

答案 1 :(得分:2)

使用 BlockListener

id

答案 2 :(得分:1)

首先:如果没有任何业务逻辑,那么就无需进入YourBloc类。

但是不时需要某些用户的活动来执行 Bloc 类中的某些逻辑,然后Bloc类必须决定下一步要做的事情:只是重建小部件显示对话框,甚至导航到下一条路线。在这种情况下,您必须向UI发送一些状态才能完成操作。

然后出现另一个问题:当Bloc发送State表示敬酒时,我该如何处理窗口小部件?

这是所有故事的主要问题。

许多答案和文章建议使用flutter_block。该库具有BlocBuilderBlocListener。使用这些课程,您可以解决一些问题,但不能100%解决。

在我的情况下,我使用BlocConsumer来管理 BlocBuilder BlocListener ,并提供了一种出色的状态管理方式。

从文档中:

BlocConsumer<BlocA, BlocAState>(
  listenWhen: (previous, current) {
    // Return true/false to determine whether or not
    // to invoke listener with state
  },
  listener: (context, state) {
    // Do stuff here based on BlocA's state
  },
  buildWhen: (previous, current) {
    // Return true/false to determine whether or not
    // to rebuild the widget with state
  },
  builder: (context, state) {
    // Return widget here based on BlocA's state
  }
)

通过 BlocConsumer 可以看到,您可以过滤状态:您可以轻松定义状态以重建小部件,并可以定义状态以显示一些弹出窗口或导航到下一个屏幕。

答案 3 :(得分:0)

类似这样的东西:

 if (state is PhoneLoginCodeSent) {
          // dispatch here to reset PhoneLoginFormState
          SchedulerBinding.instance.addPostFrameCallback((_) {
            Navigator.of(context).push(
              MaterialPageRoute(
                builder: (context) {
                  return VerifyCodeForm(phoneLoginBloc: _phoneLoginBloc);
                },
              ),
            );
            return;
          });
        }