首页 > 解决方案 > 关于防止 Listview.Builder() 重建所有项目

问题描述

我正在通过流生成器从 firebase 获取用户数据,并且我正在使用 Listview.builder() 渲染这些数据,一个问题是,当我从 firestore 获取快照时,listview.builder() 中的所有项目正在重建。如何防止这件事重新渲染或重建()

听到是我的代码

class GetUser extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    print("// <1> Use StreamBuilder");
    return StreamBuilder<QuerySnapshot>(
        // <2> Pass `Stream<QuerySnapshot>` to stream
        stream: FirebaseFirestore.instance
            .collection('users')
            .orderBy('createdAt', descending: false)
            .snapshots(),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            // <3> Retrieve `List<DocumentSnapshot>` from snapshot
            final List<DocumentSnapshot> documents = snapshot.data.docs;
            //documents.forEach((doc) => print(doc));
            print(documents.length);
            return SingleChildScrollView(
              scrollDirection: Axis.vertical,
              child: Column(
                children: [
                  SizedBox(
                    height: MediaQuery.of(context).size.height,
                    child: ListView.builder(
                      addAutomaticKeepAlives: true,
                      addRepaintBoundaries: false,
                      itemCount: documents.length,
                      itemBuilder: (context, i) {
                        return  Items(
                          doc: documents[i],
                        );
                      },
                    ),
                  )
                ],
              ),
            );
          } else if (snapshot.hasError) {
            return Text("Error");
          } else {
            return Text("Waiting");
          }
        });
  }
}

//this Item class is invoked every time I add a user to the collection

class Item extends StatefulWidget {
  final DocumentSnapshot doc;
  const Item({Key key, this.doc}) : super(key: key);

  @override
  _ItemState createState() => _ItemState();
}


class _ItemState extends State<Item> {
  @override
  Widget build(BuildContext context) {
    print("Build called ${widget.doc.id}");
    return Text("${widget.doc["full_name"]}--${widget.doc.id}");
  }
}

标签: flutterflutter-layout

解决方案


推荐阅读