Why can't I access the firestore values in flutter? - flutter

Question

Using the example here.
I modified some code to output the the message onTap as follows:
The List is generated with real values from firestore.
but the output is blank. It's not empty, as I tested with another set of output.
How can I retrieve these real values to use in onTap event handler?
....
return ListView.builder(
itemCount: messageCount,
itemBuilder: (_, int index) {
final DocumentSnapshot document = snapshot.data.documents[index];
final dynamic message = document['message'];
return ListTile(
title: Text(
message != null ? message.toString() : '<No message retrieved>',
),
subtitle: Text('Message ${index + 1} of $messageCount'),
onTap: (){
print(message.toString());
// OUTPUT: (Nothing)
},
);
},
);
....
onTap: (){
print(message.toString().isEmpty ? 'Empty' : 'Not Empty');
//OUTPUT: Not Empty
print(message== null ? 'Null' : 'Not Null');
//OUTPUT: Not Empty
},

Answer 1

The reason you don't get your variable printed in onTap may lie somewhere else, e.g. in that you are possibly running other version of your app than your current code corresponds to. Try hard resetting the app and make sure you refresh the code on the emulator. Don't open the app manually from the emulator, it can load older version of your code.
I recreated exact the same code from Flutter example and it works perfectly fine (message gets printed correctly when tapping on a list tile as expected).
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
final Firestore firestore = Firestore();
runApp(MaterialApp(
title: 'Firestore Example', home: MyHomePage(firestore: firestore)));
}
class MessageList extends StatelessWidget {
MessageList({this.firestore});
final Firestore firestore;
#override
Widget build(BuildContext context) {
return StreamBuilder<QuerySnapshot>(
stream: firestore
.collection("messages")
.orderBy("created_at", descending: true)
.snapshots(),
builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (!snapshot.hasData) return const Text('Loading...');
final int messageCount = snapshot.data.documents.length;
return ListView.builder(
itemCount: messageCount,
itemBuilder: (_, int index) {
final DocumentSnapshot document = snapshot.data.documents[index];
final dynamic message = document['message'];
return ListTile(
trailing: IconButton(
onPressed: () => document.reference.delete(),
icon: Icon(Icons.delete),
),
title: Text(
message != null ? message.toString() : '<No message retrieved>',
),
subtitle: Text('Message ${index + 1} of $messageCount'),
onTap: () {
print(message.toString());
// THIS ACTUALLY WORKS !!
},
);
},
);
},
);
}
}
class MyHomePage extends StatelessWidget {
MyHomePage({this.firestore});
final Firestore firestore;
CollectionReference get messages => firestore.collection('messages');
Future<void> _addMessage() async {
await messages.add(<String, dynamic>{
'message': 'Hello world!',
'created_at': FieldValue.serverTimestamp(),
});
}
Future<void> _runTransaction() async {
firestore.runTransaction((Transaction transaction) async {
final allDocs = await firestore.collection("messages").getDocuments();
final toBeRetrieved =
allDocs.documents.sublist(allDocs.documents.length ~/ 2);
final toBeDeleted =
allDocs.documents.sublist(0, allDocs.documents.length ~/ 2);
await Future.forEach(toBeDeleted, (DocumentSnapshot snapshot) async {
await transaction.delete(snapshot.reference);
});
await Future.forEach(toBeRetrieved, (DocumentSnapshot snapshot) async {
await transaction.update(snapshot.reference, {
"message": "Updated from Transaction",
"created_at": FieldValue.serverTimestamp()
});
});
});
await Future.forEach(List.generate(2, (index) => index), (item) async {
await firestore.runTransaction((Transaction transaction) async {
await Future.forEach(List.generate(10, (index) => index), (item) async {
await transaction.set(firestore.collection("messages").document(), {
"message": "Created from Transaction $item",
"created_at": FieldValue.serverTimestamp()
});
});
});
});
}
Future<void> _runBatchWrite() async {
final batchWrite = firestore.batch();
final querySnapshot = await firestore
.collection("messages")
.orderBy("created_at")
.limit(12)
.getDocuments();
querySnapshot.documents
.sublist(0, querySnapshot.documents.length - 3)
.forEach((DocumentSnapshot doc) {
batchWrite.updateData(doc.reference, {
"message": "Batched message",
"created_at": FieldValue.serverTimestamp()
});
});
batchWrite.setData(firestore.collection("messages").document(), {
"message": "Batched message created",
"created_at": FieldValue.serverTimestamp()
});
batchWrite.delete(
querySnapshot.documents[querySnapshot.documents.length - 2].reference);
batchWrite.delete(querySnapshot.documents.last.reference);
await batchWrite.commit();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Firestore Example'),
actions: <Widget>[
FlatButton(
onPressed: _runTransaction,
child: Text("Run Transaction"),
),
FlatButton(
onPressed: _runBatchWrite,
child: Text("Batch Write"),
)
],
),
body: MessageList(firestore: firestore),
floatingActionButton: FloatingActionButton(
onPressed: _addMessage,
tooltip: 'Increment',
child: const Icon(Icons.add),
),
);
}
}

Answer 2

TLDR: Updating the database values worked.
This must be the most weirdest thing I have seen.
But instead of the Text itself, I tried printing the length of it and it has same length as the text it had in ListTile.
Then I checked the firebase database. My findings:
Data was visible
Plain text - English
Selecting the data and copy pasting it on a notepad pasted Nothing
Retyping the data made the app to work as expected.
I didn't think of it before, but how the data was initially added to database might have been the issue.