首页 > 解决方案 > Flutter - 更改页面并返回后,StreamBuilder 似乎没有收听流

问题描述

我有一个页面,我使用 Bloc 从上面的搜索栏中获取文本,以根据输入的文本过滤下面的列表。

当我第一次进入页面时,Bloc 和流都按预期工作,但是,当我弹出它并返回页面时,我可以看到数据正在通过 sink add 添加到 bloc,但流构建器没有'不要重建自己,看起来它不再听流了,idk。

这是我调用有问题的页面(特征)的地方

List<Widget> _steps = [
    CharacteristicsProvider(child: Characteristics()),
    Optionals(),
    Prices(),
    Advertiser(),
    Photos(),
  ];

  Widget build(context) {
    var mediaQD = MediaQuery.of(context);
    _safeAreaSize = mediaQD.size;
    return WillPopScope(
      onWillPop: _willPopCallback,
      child: Scaffold(
          backgroundColor: Color(0xffEFEFEE),
          appBar: AppBar(
            title: Text("Criar Anúncio"),
          ),
          body: SingleChildScrollView(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                _getStepProgress(),
                _steps[_curPage - 1],
              ],
            ),
          ),
    );
  }

这是调用 sink.add 后 StreamBuilder 不会重建自身的页面:

class _SelectionPageState extends State<SelectionPage> {
  SearchBarBloc bloc;

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    bloc = SearchBarProvider.of(context);
  }

  @override
  void dispose() {
    super.dispose();
    bloc.dispose();
  }

  Widget build(context) {
    List<String> sortedList = widget.list;
    if (!widget.isOrdered) {
      sortedList.sort();
    }

    return Scaffold(
      backgroundColor: Color(0xffECECEC),
      appBar: AppBar(
        title: widget.title,
      ),
      body: Column(
        children: <Widget>[
          SearchBar(
            onTextChange: (s) {
              bloc.changeText(s);
            },
          ),
          Container(
            margin: EdgeInsets.only(top: 20),
            child: buildList(bloc: bloc, sortedList: sortedList),
          ),
        ],
      ),
    );
  }

  Widget buildList({SearchBarBloc bloc, List<String> sortedList}) {
    return StreamBuilder(
        stream: bloc.text,
        builder: (context, snapshot) {
          print("data1");
          List filteredList =
              filterList(text: snapshot.data, sortedList: sortedList);
          return ListView.builder(
            itemCount: filteredList.length,
            itemExtent: 55,
            shrinkWrap: true,
            itemBuilder: (context, index) {
              return Container(
                decoration: BoxDecoration(
                  border: Border(bottom: BorderSide(color: Colors.black38)),
                  color: Colors.white,
                ),
                child: ListTile(
                  title: Text(filteredList[index]),
                  onTap: () {
                    bloc.clearText();
                    widget.onTap(widget.list.firstWhere(
                        (element) => element.contains(filteredList[index])));
                    Navigator.pop(context);
                  },
                ),
              );
            },
          );
        });
  }

  /// Filters the list based on search bar's text.
  List filterList({String text, List<String> sortedList}) {
    if (text == null || text == "") {
      return sortedList;
    }
    var filteredList = sortedList
        .where((element) => element.toLowerCase().contains(text.toLowerCase()))
        .toList();
    return filteredList;
  }
}

最后,这是我的 Bloc 页面:

import 'dart:async';
import 'package:rxdart/rxdart.dart';

class SearchBarBloc {
  final _text = PublishSubject<String>();

  // listen to stream
  Observable<String> get text => _text.stream;

  // Changing data
  Function(String) get changeText => _text.sink.add;

  clearText() {
    changeText("");
  }

  dispose() {
    _text.close();
    _text.sink.close();
  }
}

我希望它继续过滤列表,就像我第一次进入页面时它已经在做的那样。但是每当我转到其他页面并重新进入特性页面时,它在更改文本后不再通过 StreamBuilder,因此,列表不再被过滤。

标签: flutterdart

解决方案


我找到了问题...在打开页面之前,我忘记为页面添加 SearchBarProvider。添加后,页面开始按预期工作。


推荐阅读