Flutter：来自 Firestore 的项目在刷新之前未显示在 GridView 中

Question

我在这里有一个连接到 Firestore 后端的颤振应用程序，我在这里遇到了一个奇怪的行为。

当应用程序启动或我进行热重启时，从数据库中获取的项目会显示一秒钟然后再次消失，我必须应用 RefreshIndicator 并向下拖动屏幕以刷新产品并让它们再次出现。

这是我获取项目的代码：

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);
  }
}

这是 GridView 及其接收项目的方式：

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(),
          ),

这里是我调用 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 确保构建不会在同一个构建中再次触发。