嵌套的StreamBuilder是好的模式吗?

时间:2019-05-06 20:58:54

标签: flutter bloc rxdart

我正在使用Bloc Pattern和Streams从HackerNews API获取文章。

我正在加载所有文章,并在流构建器的帮助下将其呈现在UI中,并且效果很好。

现在,我用新加载的StreamBuilder包装了获取Stream构建器的文章。 现在,当加载流构建器为true时(表示正在加载),它会显示一个圆形进度指示器,否则,它将显示子级(包装有Stream Builder的文章列表)。

这很好。但是令我困惑的是我将Stream builder封装在stream builder中。我知道我可以帮助rxdart,但我不确定如何。

我尝试借助或不通过snapshot.hasData添加一个加载器,但是那没有用,所以我决定创建另一个流和主题,该对象采用bool并告诉UI是否正在加载。 / p>

将数据提取到整块中的代码:

  <input value="12345"/>

UI:

 _getAndUpdateArticles(StoryType storyType) {
    _isLoadingSubject.add(true);
    getListIds(storyType).then((list) {
      getArticles(list.sublist(0, 10)).then((_){
        _articleSubject.add(UnmodifiableListView(_articles));
        _isLoadingSubject.add(false);
      });
    });
  }

编辑

我已经尝试过了,但这不起作用:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: StreamBuilder(
        stream: widget.hnBloc.isLoading,
        builder: (context, snapshot) {
          if (snapshot.data) {
            return Center(child: CircularProgressIndicator());
          } else {
            return StreamBuilder<UnmodifiableListView<Article>> (
              initialData: UnmodifiableListView<Article>([]),
              stream: widget.hnBloc.article,
              builder: (context, snapshot) => ListView(
                children: snapshot.data.map(_buildItem).toList(),
              ),
            );
          }
        },
      ),
  .........

1 个答案:

答案 0 :(得分:1)

我认为没有避免嵌套StreamBuilders的完整方法。我个人认为这不是一个坏习惯,但是肯定会导致更多的构建。
在您的情况下,您可以修改hnBloc以发出可以是加载状态或数据状态的单个状态,从而消除了对嵌套StreamBuider的需求。

例如

StreamBuilder<HnState>(
          stream: hnBloc.currentState,
          initialData: HnLoadingState(),
          builder: (context, snapshot) {
            if (snapshot.data is HnLoadingState) {
              return Center(child: CircularProgressIndicator());
            }if (snapshot.data is HnDataState) {
              return ListView(
                children: snapshot.data.map(_buildItem).toList(),
              ),
            }

          },
)  

在使用flutter_bloc软件包时,这种模式非常普遍。您可以查看此here的基本示例,以更好地理解它。