在 Flutter 中恢复互联网连接时获取数据答案

【问题标题】：Fetch data when internet connection comes back in Flutter在 Flutter 中恢复互联网连接时获取数据
【发布时间】：2020-01-10 13:31:18
【问题描述】：

我正在开发一个从 Internet 获取一些数据的应用程序。为了避免互联网连接出现问题，我添加了connectivity package。

如果应用程序启动时连接了互联网，然后关闭了互联网连接，我可以显示一个带有“无互联网”文本的容器。如果我再次打开互联网，则会显示数据。

实现这一点的代码如下：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:connectivity/connectivity.dart';

class CheckNetworkPage extends StatefulWidget {
  @override
  _CheckNetworkPageState createState() => _CheckNetworkPageState();
}

class _CheckNetworkPageState extends State<CheckNetworkPage> {
  StreamSubscription<ConnectivityResult> _networkSubscription;

  Future<List<Data>> fetchData() async {

  // Code to fetch data

 }


  @override
  initState() {
    super.initState();
    fetchData();
    _networkSubscription = Connectivity().onConnectivityChanged.listen((ConnectivityResult result) {
     _connectionStatus = result.toString();
     print(_connectionStatus);

     if (result == ConnectivityResult.wifi ||
      result == ConnectivityResult.mobile ||
      result == ConnectivityResult.none) {
      print("Result: $result");
      setState(() {});
  }
    });
  }

// Cancel subscription after you are done
  @override
  dispose() {
    super.dispose();

    _networkSubscription.cancel();
  }

   @override
   Widget build(BuildContext context) {
    // More code. I can use the result of _connectionStatus to build my app
   }
 }

但是，如果应用程序在没有互联网的情况下启动，当我打开它时，数据不会加载，因为它是在 initState() 中获取的。

如何在未获取数据且已开启互联网连接时获取数据？

【问题讨论】：

乍一看，您的代码似乎没有任何问题。连接更改是否根本没有触发？
上面的代码按预期工作。但是，如果我在没有互联网的情况下首次启动应用程序，然后在应用程序运行时打开互联网，则不会显示数据。如果我通过互联网连接启动应用程序，则会显示数据。我想在打开互联网时加载数据，但数据尚未下载。
我明白，但我的问题是，当您在关闭应用程序后打开互联网时，连接监听器是否会接收更改并触发您的代码？
在这种情况下，如果我启动应用程序，我会收到ConnectivityResult.none，当我打开互联网时，我会按预期收到ConnectivityResult.wifi
那么，当 ConnectivityResult 是 wifi 或 mobile 时，您应该能够仅 fetchData()。当您没有连接时，您在下面标记为正确的答案将导致错误。它仍然会尝试获取数据。

标签： flutter dart connectivity

【解决方案1】：

您可以将最新获取的数据存储在变量中。

List<Data> fetchedData;

Future<List<Data>> fetchData() async {

  // Code to fetch data
  // Add this :
  fetchedData = ...
}

然后在你的监听器中，检查是否定义了这个数据：

if (result == ConnectivityResult.wifi ||
    result == ConnectivityResult.mobile ||
    result == ConnectivityResult.none) {
        print("Result: $result");
        setState(() {});
        // Add this : 
        if (fetchedData == null) fetchData()
}

【讨论】：

但是你把监听器放在哪里，它将在每个应用程序屏幕上调用？