Stream builder 在第一次加载屏幕时未加载所需的数据，然后在更改选项卡后正常工作：Flutter答案

【问题标题】：Stream builder not loading desired data at the first loading of the screen, then working as it should after changing tabs : FlutterStream builder 在第一次加载屏幕时未加载所需的数据，然后在更改选项卡后正常工作：Flutter
【发布时间】：2020-07-30 08:03:47
【问题描述】：

我正在使用 Stream builder 使用 Flutter 在屏幕上填充不同选项卡的正文内容。流构建器从 Firebase 获取数据并将这些值传递到不同的列表中，这些列表在 listView 构建器中用于显示内容。

屏幕上的选项卡应该会根据前一个屏幕上的选择而改变。这部分效果很好。然而，

问题一：

在初始加载屏幕时，所有选项卡的内容都显示在最初选择的选项卡下。只有当我向右滑动一次，即转到其他选项卡时，我才能在屏幕上获得所需的内容，即各个选项卡下的相应内容。

问题 2：

如果我从这个屏幕返回到上一个屏幕并再次做出不同的选择...在这个屏幕上打开的第一个选项卡上，我会从上一个选项卡中获取内容按钮。只有在选择不同的选项卡时，我只能获得所需的输出。

这表示编写的代码有效，但仅在某些条件下有效。选项卡完全按预期加载，即使在第一次尝试时，也只有选项卡下的内容是一个问题……这也是，仅在加载的第一个屏幕上。这清楚地表明流构建器有问题，但我似乎无法弄清楚究竟是什么。

我使用流生成器的代码布局是：

 body : StreamBuilder(
  
  stream: Firestore.instance
          . //Required Reference//     
          .snapshots(),
  
  builder: (BuildContext context, AsyncSnapshot <QuerySnapshot>snapshot) {
    
    var someData = snapshot.data.documents;
    List<dynamic> someDocs = someData;

    if (snapshot.hasData == null){
      return CircularProgressIndicator(),}


    else if (snapshot.data.documents.length > 0){ 

      RequiredList1 = [];
      ..... More such statements ..........
      RequiredList11 = [];

      for(int i =0; i < someDocs.length; i++){
  
        RequiredList1.add(someData[i]['field1']);
        ....... More such calls ................
        RequiredList11.add(someData[i][field11']);            

      } 
       return WidgetToShowContents
      
       }
      }
     );

唯一值得一提的是，所做的引用包括当前选择的选项卡的名称。但是，由于该选项卡显示正确，并且所有其他选项卡也可以正常工作，因此我确信这不是造成问题的原因。

我曾想过使用 dispose 方法摆脱流构建器来解决问题 2，但我不知道如何使用流构建器来实现它，我也不确定这是否可行。

【问题讨论】：

标签： android firebase flutter tabbar stream-builder

【解决方案1】：

您是否尝试过将您的StreamBuilder 翻转过来，我知道它看起来可能无关紧要，但我已经看到它有所作为，如果这有帮助，请告诉我。

StreamBuilder(

  stream: Firestore.instance
          . //Required Reference//     
          .snapshots(),

  builder: (BuildContext context, AsyncSnapshot <QuerySnapshot>snapshot) {


    if (snapshot.hasData){
      if(snapshot.data.documents.length > 0){
 var someData = snapshot.data.documents;
    List<dynamic> someDocs = someData;

         RequiredList1 = [];
      ..... More such statements ..........
      RequiredList11 = [];

      for(int i =0; i < someDocs.length; i++){

        RequiredList1.add(someData[i]['field1']);
        ....... More such calls ................
        RequiredList11.add(someData[i]['field11']);            

      } 

      }else{
           return WidgetToShowContents
      }


    }else{
      CircularProgressIndicator();
    }


  }
     );

【讨论】：

不幸的是，这样做不会改变任何事情。我认为它可能对其他一些事情有所帮助。你有什么其他想法可以用来解决这个问题吗？谢谢！ :)

【解决方案2】：

好的，经过大量调试，我想出了在加载第一个选项卡时没有在正文中获得所需内容的原因，而是在所有后续选项卡中。

唯一值得一提的是，所做的引用包括当前选择的选项卡的名称。但是，由于选项卡显示正确，并且所有其他选项卡也可以正常工作，我确信这不是造成问题的原因。

我所做的是，引用调用取决于当前选择的选项卡中的值，即对于不同的选项卡，将提取和显示不同的数据。

 @override
   void initState() {
   super.initState();    
  tabController = TabController(length: subCategoryList.length, vsync: this, initialIndex: 0);
  tabController.addListener(_setActiveTabIndex);
}

void _setActiveTabIndex() {
  activeTabIndex = tabController.index;
  setState(() {
    currentTab = subCategoryList[activeTabIndex].toString(); 
  });
}

现在，我在 initState() 中初始化 tabController 并使用侦听器来了解当前处于活动状态的选项卡。在打印这些值时，我了解到在第一次加载屏幕时，“activeTabIndex”和“currentTab”返回空值。首次加载第二个屏幕或返回第一个屏幕并选择另一个选项以再次进入此屏幕时就是这种情况。

结果，它在内容中返回所需的值，只要选择了不同的选项卡，除了第一个选项卡时。 p>

为了解决这个问题，我将 currentTab 的默认值设置为始终根据页面加载时显示的第一个选项卡加载内容。为此，我在 initState() 中添加了一行：

  @override
   void initState() {
   super.initState(); 

  currentTab = subCategoryList[0].toString();
  tabController = TabController(length: subCategoryList.length, vsync: this, initialIndex: 0);
  tabController.addListener(_setActiveTabIndex);
 }

现在，无论何时加载页面，我都会在正文中获得所需的内容，因为在构建显示内容的小部件时，这些值已经初始化。

【讨论】：