如何在 flutter 中创建套接字异常屏幕？

Question

在我的flutter项目中，我需要在调用API时发生套接字异常时显示一些插图图像。我该怎么做？

提前致谢

Answer 1

这取决于您要在小部件树中的哪个位置显示它。一个简单的例子是将一个新屏幕推送到导航堆栈。您将需要在可能发生异常的函数中使用 BuildContext。

void someMethod(BuildContext context) {
    try {
      //some code that might throw an exception
    } on Exception catch (_) {
      Navigator.pushNamed(context, "Your illustration view");
    }
  }

另一个例子是根据布尔值将其添加到您的小部件树中。当抛出异常时，您将该布尔值设置为 true。

void someOtherMethod() {
    try {
      //some code that might throw an exception
    } on Exception catch (_) {
      setState(() {
      hasThrownError = true; 
      });
    }
  }

像这样在您的小部件树中使用它：

bool hasThrownError = false;

  Widget buildWidgetTree() {
    return hasThrownError
        ? Text("This is where you can show your error illustration")
        : Text("This is wher you can show your regular view");
  }

Answer 2

这将有助于处理套接字异常和格式异常。

为 httpresponse

创建模型 class

class HTTPResponse<T> {
  bool isSuccessful;
  T data;
  String message;
  int responseCode;
  HTTPResponse(this.isSuccessful, this.data, {this.message, this.responseCode});
}

然后像这样在 api 响应中使用此模型

Future<HTTPResponse<List<Post>>> getPosts(
      {int limit = 20, int page = 1}) async {
    String url =
        'https://jsonplaceholder.typicode.com/posts?_limit=$limit&_page=$page';
    Uri uri = Uri.parse(url);

    try {
      var response = await http.get(uri);
      if (response.statusCode == 200) {
        var body = json.decode(response.body);
        List<Post> postsList = [];
        body.forEach((e) {
          Post post = Post.fromJson(e);
          postsList.add(post);
        });
        return HTTPResponse(
          true,
          postsList,
          responseCode: response.statusCode,
        );
      } else {
        return HTTPResponse(false, null,
            message: 'Invalid response from server',
            responseCode: response.statusCode);
      }
    } on SocketException {
      return HTTPResponse(false, [], message: 'Unable to reach the internet');
    } on FormatException {
      return HTTPResponse(false, [], message: 'Invalid response from server');
    } catch (e) {
      return HTTPResponse(false, [],
          message: "Something went wrong please try in a minute or two");
    }
  }

如何在 flutter 中创建套接字异常屏幕？

How to create a screen on socket exception in flutter?

api

exception

socketexception

dart

flutter