Flutter: Items from Firestore Not Shown in the GridView until Refresh - firebase

Question

I have a flutter app here connected to firestore backend and I face a strange behaviour here.
When the app starts or I do hot restart the items fetched from the database are shown for one second and then disappear again and I have to apply RefreshIndicator and drag the screen down to refresh the products and let them appear again.
Here is my code to fetch items:
Future<void> fetchitems() async {
try {
final List<Product> loadedProducts = [];
final response = await Firestore
.instance
.collection("products")
.getDocuments();
response.documents.forEach((element) {
loadedProducts.add(Product(
id: element.documentID,
title: element.data['title'],
description: element.data['description'],
price: element.data['price'],
imageUrl: element.data['imageUrl']
));
});
_items = loadedProducts;
notifyListeners();
} catch (error) {
print(error);
}
}
Here is GridView and how it receives items:
Widget build(BuildContext context) {
final productsData = Provider.of<Products>(context);
final products = productsData.items;
return GridView.builder(
padding: const EdgeInsets.all(10.0),
itemCount: products.length,
itemBuilder: (ctx, i) => ChangeNotifierProvider.value(
value: products[i],
child: ProductItem(),
),
Here is where I call the GridView:
class _ProductsOverviewScreenState extends State<ProductsOverviewScreen> {
var _isIntit = true;
var _isLoading = false;
Future<void> _refreshProducts(BuildContext context) async {
await Provider.of<Products>(context).fetchAndSetProducts();
}
#override
void initState() {
super.initState();
}
#override
void didChangeDependencies() {
if (_isIntit) {
setState(() {
_isLoading = true;
});
Provider.of<Products>(context).fetchitems().then((_) {
setState(() {
_isLoading = false;
});
});
}
_isIntit = false;
super.didChangeDependencies();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: _isLoading ? Center(child: CircularProgressIndicator(), ) : RefreshIndicator(
onRefresh: () => _refreshProducts(context),
child: ProductsGrid()),
);
}
}

Answer 1

final productsData = Provider.of<Products>(context, listen: false);
listen: false ensure that build will not retrigger again in the same build.