根据流中的数据导航

Posted 2023-02-23

【中文标题】根据流中的数据导航

【英文标题】：Navigate based on data from stream

【发布时间】：2019-09-23 05:54:39

【问题描述】：

流构建器用于根据流中的数据绘制小部件。

基于数据实现导航的正确方法是什么？

详情： 抽屉里有一个注销按钮。它清除会话并在流中发出数据。

有一个带有流构建器的无状态小部件，可以监听数据并更新 UI。如何让它到登录屏幕？

【问题讨论】：

Navigating to a new screen when stream value in BLOC changes的可能重复

【参考方案1】：

灵感来自https://***.com/a/54109955/1918649

在创建 Profile 的小部件的 build 方法中

  @override
  Widget build(BuildContext context) 
    final userBloc = BlocProvider.of<UserBloc>(context);
    return ...
           somewhere here Profile(userBloc)
           ...

class Profile extends StatefulWidget  

  final userBloc;

  Profile(this.userBloc);

  @override
  State<StatefulWidget> createState() => ProfileState();


class ProfileState extends State<Profile> 

  @override
  void initState() 
    super.initState();
    widget.userBloc.stream.listen((userData)
      if(userData==null) 
        Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => LandingPage(),
            ));
      
    );
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: new AppBar(
        title: new Text("Profile"),
      ),
      drawer: CustomDrawer(),
      body: Center(
        child: StreamBuilder<UserModel>(
          initialData: widget.userBloc.user,
          stream: widget.userBloc.stream,
          builder: (ctx, snap) => snap.hasData?Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Image.network(snap.data?.imageUrl),
              Text(snap.data?.username)
            ],
          ):Text('You are logged out'),
        ),
      ),
    );
  

【参考方案2】：

在无状态小部件的构建方法中，您可以使用listen() 方法监听流中的更改。

 Widget build(BuildContext context) 
    Repository.bulletins.listen((pet) 
      pet.documents[pet.documents.length - 1].data['animalType'] == "Dog"
          ? Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => LostPetForm(),
              ))
          : print('not yet');
    );
    return Scaffold(...

【讨论】：

I/flutter (14304): The following assertion was thrown while finalizing the widget tree: I/flutter (14304): setState() or markNeedsBuild() called when widget tree was locked. I/flutter (14304): This _ModalScope<dynamic> widget cannot be marked as needing to build because the framework is I/flutter (14304): locked. 从构建方法中的侦听器方法导航时出现此异常。我读到无法从内部构建方法导航。

你在哪里读到的？在我尝试了一个带有 2 个屏幕和后端 Firestore 的小应用程序后，我发布了它，当我从 Firestore 更改数据时，它自行导航，没有问题。此错误表示您在构建阶段调用 setState。如果您没有使用 setState，则 Navigator.pop 根据此 SO 帖子在内部使用 setState。 ***.com/a/51246379/9779791 也许你可以尝试在代码的其他地方使用 Navigator，也许在 initState()