firebase / flutterfire

🔥 A collection of Firebase plugins for Flutter apps.
https://firebase.google.com/docs/flutter/setup
BSD 3-Clause "New" or "Revised" License
8.46k stars 3.91k forks source link

The firebase RTDB data fetching issue from the "FirebaseAnimatedList" function code #12635

Closed 4444monkey closed 1 month ago

4444monkey commented 1 month ago

Hi There, I hope I could have any advice regarding the weird display on the Android mobile system. The issue I found was related to the function "FirebaseAnimatedList" that I called and tried to read the real-time data update from Firebase RTDB. I was sure everything went smoothly couple weeks ago, and no abnormal display was observed as well. Somehow, I re-tested it and found the abnormal display with the iterative wordings. I am confused about why it suddenly became this (picture was attached). S__81338371

Other configurations were correctly set up following the website. Dependencies are up to date. coding environment: Windows-VScode, Flutter kit, dart code

The code is as follows (I just simplified it):

//=================================================== import 'package:firebase_database/firebase_database.dart'; import 'package:firebase_database/ui/firebase_animated_list.dart'; import 'package:flutter/material.dart';

class DataPage extends StatefulWidget { const DataPage({Key? key, required this.title}) : super(key: key); final String title;

@override State createState() => _DataPageState(); }

class _DataPageState extends State { // Get the Stream final DatabaseReference _userRef = FirebaseDatabase.instance.ref();

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

@override Widget build(BuildContext context) { return Scaffold( backgroundColor: const Color.fromARGB(255, 166, 224, 211), appBar: AppBar( centerTitle: true, title: const Text("RTDB Data Fetching"), ), body: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ Expanded( child: FirebaseAnimatedList( query: _userRef, itemBuilder: (context, snapshot, animation, index) { // Replace the placeholder 'Test' with actual data from the snapshot return Container( child: Text('Test'), ); }, ), ), ], ), ); } }

Originally posted by @4444monkey in https://github.com/firebase/flutterfire/discussions/12634

russellwheatley commented 1 month ago

@4444monkey - It must have 9 data nodes in the root of the RTDB data node. This query:

FirebaseDatabase.instance.ref();

is a reference to the root of your data.

4444monkey commented 1 month ago

Yes, there are 9 variables on the RTDB. However, I was wondering why it repeatedly showed 9 times of the display by using the FirebaseAnimatedList function. I was able to read the individual data under a specific child path, but now I cannot.