Flutter：帶有 Firebase 的 StreamBuilder

Question

我有一個來自Firebase的對象的ListView ，我希望在數據更改時使用StreamBuilder刷新它。

我可以很好地加載我的列表，當數據更改時我的列表會刷新。

我遇到的問題不是剛剛更新更改的ListTile ，而是看到該圖塊被復制，因此我看到了新更改和舊更改。

這是我的設置：

final ref = FirebaseDatabase.instance.reference();
late DatabaseReference itemRef;
late FirebaseDatabase database = FirebaseDatabase();
late StreamSubscription _objectInfoStreamSub; // Not sure if needed?
late List<CustomObject> data = [];

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

    final keys = Global.kData.keys;

    for (final key in keys) {
      // Initialize this...
      itemRef = database.reference().child('ABC').child(key.toString());
    }

    // Load the data...
    _setListeners();
}

// Here is where I load my data initially...
Future<void> _setListeners() async {
    // Clear out our data before we reload...
    data.clear();

    final keys = Global.kData.keys;

    for (final key in keys) {
      _objectInfoStreamSub =
          ref.child("ABC").child(key.toString()).onValue.listen(
        (event) {
          setState(() {
            // Mapped the data...
            final firebaseData = Map<String, dynamic>.from(event.snapshot.value);

            // Create the Room...
            final room = CustomObject.fromJson(firebaseData);

            // Check if blocked...
            // Logic to see if user is blocked
            
            // check if isArchived
            // Logic to see if room is archvied

            if (!isBlocked && !isArchived) {
              if (!data.contains(room)) {
                data.add(room);
              }
            }

            // Sort by date
            // Logic to sort so the most recent is at top
          });
        },
      );
    }
}

// Here is my updated StreamBuilder...
SliverToBoxAdapter(
  child: StreamBuilder<dynamic>(
    stream: itemRef.child('ABC').onValue,
    builder: (context, snapshot) {
      if (snapshot.connectionState == ConnectionState.waiting) {
        return Center(
          child: CircularProgressIndicator(),
        );
      }
      if (snapshot.hasData &&
                        snapshot.connectionState == ConnectionState.active) {
        return ListView.builder(
          physics: NeverScrollableScrollPhysics(),
          shrinkWrap: true,
          itemCount: data.length,
          itemBuilder: (BuildContext context, int index) {
            return ChatRoom(
              data: data[index],
            );
          },
        );
      } else {
        return Container();
      }
    },
  ),
),

Answer 1

不確定這是否會導致您的問題，但請嘗試使用StreamBuilder包裝ListView.builder()而不僅僅是它的項目。 因為在您當前的 state 代碼中，如果您要添加另一個項目並且您的data.length會發生變化，則ListView.builder()不會重建，也不會構建新數據。