flutter - ListView.builder itemCount 未在 StreamBuilder 中更新

Question

我有一个 flutter 应用程序，其中使用 ListView.Builder 生成列表，其中 itemCount 是 firestore 集合中的文档数。

当我将文档添加到集合中时，我可以通过打印看到值 snapshot.data.documents.length 发生变化，但 itemCount 没有变化，这会导致以下错误:

无效值:不在 0..17 范围内，包括:18

这是我创建的关于相同问题的 GitHub 线程:https://github.com/flutter/flutter/issues/39206

这是相关页面的代码，我从中得到错误的列表是靠近底部的 StreamBuilder 中的那个:

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

import 'package:cloud_firestore/cloud_firestore.dart';

/*
Visar kontaktinformation
 */

class Contact extends StatefulWidget {
  @override
  _ContactState createState() => _ContactState();
}

class _ContactState extends State<Contact> {
  _hasDesc(desc) {
    if (desc == '') {
      return false;
    } else {
      return true;
    }
  }
  String sortby = 'namn';
  bool decending = false;

  var showInfo;
  TextEditingController controller = new TextEditingController();
  String filter;

  @override
  void initState() {
    super.initState();
    controller.addListener(() {
      setState(() {
        filter = controller.text.toLowerCase(); //Gör om till gemener för att inte vara skiftlägeskänslig
      });
    });
  }

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

  Widget _personer(context, DocumentSnapshot document, index) {
    //Skapar lista från databasen med kontaktinformation
    //Denna lista måste vara i rätt ordning i databasen
    final info = List<String>.from(document['info']);

    //Om sökrutan är tom visas alla personer, om inte så visas bara de som matchar filtret
    if (filter == null ||
        filter == '' ||
        document['namn'].toLowerCase().contains(filter) ||
        document['beskrivning'].toLowerCase().contains(filter)) {
      return Column(
        children: <Widget>[
          ListTile(
            onTap: () {
              setState(() {
                for (int i = 0; i < showInfo.length; i++) {
                  if (i != index) {
                    showInfo[i] = false; // för att enbart ett kort ska vara expanderat åt gången
                  }
                }
                showInfo[index] = !showInfo[index];
              });
            },
            title: Padding(
              padding: const EdgeInsets.fromLTRB(0, 4, 0, 4),
              child: Column(
                children: <Widget>[
                  Text(
                    document['namn'],
                    textAlign: TextAlign.center,
                    style: Theme.of(context).textTheme.headline,
                  ),
                  Visibility(
                    visible: _hasDesc(document['beskrivning']),
                    child: Text(
                      document['beskrivning'],
                      textAlign: TextAlign.center,
                      style: Theme.of(context).textTheme.subtitle.copyWith(fontSize: 20),
                    ),
                  ),
                  Visibility(
                    visible: showInfo[index],
                    child: ListView.builder(
                      //Bygger lista med kontaktinfo för varje person
                      physics: NeverScrollableScrollPhysics(),
                      shrinkWrap: true,
                      itemCount: info.length,
                      itemBuilder: (context, index) {
                        return Padding(
                          padding: const EdgeInsets.only(top: 5),
                          child: ButtonTheme(
                            child: GestureDetector(
                              onTap: () {
                                Clipboard.setData(ClipboardData(text: info[index]));
                                //skapar snackbar
                                final copiedTextSnackBar = SnackBar(
                                  content: Text('"${info[index].replaceAll('/', '')}" har kopierats'),
                                  action: SnackBarAction(
                                    label: 'Okej',
                                    onPressed: () => Scaffold.of(context).hideCurrentSnackBar(),
                                  ),
                                );
                                //Stänger eventuell snackbar och viar en ny
                                Scaffold.of(context).hideCurrentSnackBar();
                                Scaffold.of(context).showSnackBar(copiedTextSnackBar);
                              },
                              child: Text(
                                info[index].replaceAll('/', '\n'),
                                textAlign: TextAlign.center,
                                style: Theme.of(context).textTheme.body1.copyWith(
                                  fontSize: 16,
                                  color: Color(0xff555555),
                                ),
                              ),
                            ),
                          ),
                        );
                      },
                    ),
                  ),
                ],
              ),
            ),
          ),
          Divider(
            color: Colors.black,
          ),
        ],
      );
    } else {
      return SizedBox(
        height: 0, //Visar ingenting om filtret inte stämmer
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: <Widget>[
          Row(
            children: <Widget>[
              Flexible(
                child: TextField(
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.fromLTRB(20, 10, 20, 10),
                    hintText: 'Sök',
                    border: InputBorder.none,
                  ),
                  controller: controller,
                ),
              ),
              Text('Sortera:   ', style: TextStyle(fontSize: 16, color: Color(0xff555555)),),
              DropdownButton<String>(
                  value: sortby,
                  onChanged: (String newValue) {
                    setState(() {
                      sortby = newValue;
                    });
                  },
                  items: [
                    DropdownMenuItem(
                      value: 'namn',
                      child: Text('Namn'),
                    ),
                    DropdownMenuItem(
                      value: 'beskrivning',
                      child: Text('Titel'),
                    )
                  ]
              ),
              Stack(
                children: <Widget>[
                  Visibility(
                    visible: decending,
                    child: IconButton(
                      icon: Icon(Icons.arrow_upward),
                      onPressed: () => setState(() {
                        decending = false;
                      }),
                    ),
                  ),
                  Visibility(
                    visible: !decending,
                    child: IconButton(
                      icon: Icon(Icons.arrow_downward),
                      onPressed: () => setState(() {
                        decending = true;
                      }),
                    ),
                  )
                ],
              )
            ],
          ),
          Expanded(
            child: Container(
              child: StreamBuilder(
                stream: Firestore.instance.collection('kontakt').orderBy(sortby, descending: decending).snapshots(), //Hämtar data från databas
                builder: (context, snapshot) {
                  //För att inte skriva över existerande lista:
                  if (showInfo == null) {
                    //Listan genereras här för att slippa kalla på databasen två ggr
                    showInfo = List.generate(snapshot.data.documents.length, (index) => false);
                  }
                  if (!snapshot.hasData) {
                    return Container();
                  } else if (snapshot.hasData) {
                    print(snapshot.data.documents.length);
                    return ListView.builder(
                      itemCount: snapshot.data.documents.length,
                      itemBuilder: (context, index) =>
                          _personer(context, snapshot.data.documents[index], index),
                    );
                  } else {
                    return Center(
                      child: Text("Error"),
                    );
                  }
                },
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Answer 1

我相信这是因为这条线:

if (showInfo == null) {
  showInfo = List.generate(snapshot.data.documents.length, (index) => false);
}

showInfo 列表仅根据提供的条件更新一次。起初，showInfo 为 null，因此它得到更新。在连续重建时，List 不会更新，因为它不再等于 null。尝试删除 if 条件，看看会发生什么。