妥善处理Flutter的404 Not Found 未找到错误

栏目: IT技术 · 发布时间: 4年前

内容简介:Flutter已经支持了Web端, 我们可以使用其创建动态网站了. Flutter能够处理来自Web的错误, 比如404未找到. 但是如何为Flutter应用创建自定义的404页面呢?本文将介绍如何创建自定义页面, 用于用户在试图搜索不存在的页面时给用户友好提示.每个人在上网冲浪时都遇到过”404 Not Found”、”页面不存在”等等. Flutter通过自动将你重定向至初始路由来解决此问题(通常是APP首页). 观赏下一些大厂好看的404页面:

Flutter已经支持了Web端, 我们可以使用其创建动态网站了. Flutter能够处理来自Web的错误, 比如404未找到. 但是如何为Flutter应用创建自定义的404页面呢?

本文将介绍如何创建自定义页面, 用于用户在试图搜索不存在的页面时给用户友好提示.

在Flutter中将客户端重定向至自定义404页面

每个人在上网冲浪时都遇到过”404 Not Found”、”页面不存在”等等. Flutter通过自动将你重定向至初始路由来解决此问题(通常是APP首页). 观赏下一些大厂好看的404页面:

妥善处理Flutter的404 Not Found 未找到错误
AirBnb(爱彼迎) 的404页面
妥善处理Flutter的404 Not Found 未找到错误
Github 的 404页面
妥善处理Flutter的404 Not Found 未找到错误
Flutter 的 404页面

如果你想拥有一个类似上方精美的404页面该怎么办? Flutter可以轻松做到这一点.

想创建自定义404错误页面, 你的APP需要使用 MaterialApp , CupertinoAppWidgetsApp 小部件. 大多数APP也是使用它们三个之一. 它是创建Flutter APP时调用的第一个小部件.

MaterialApp通过以下顺序搜索路径来配置顶级导航器:

  1. 对于 / 路由, 使用 home 属性(如果不是null).
  2. 否则, 若 routes 包含该路由, 则通过其处理.
  3. 否则将会调用 onGenerateRoute (如果提供). 对于任何未被 homeroutes 处理的有效路由, 它应返回非null值.
  4. 最后, 若上述均未处理路由, 则会调用 onUnknownRoute .

如果上述的方法均未处理路由, 将使用 onUnknownRoute 来处理. 此函数通常用于异常处理. 比如此函数总是生成一个”404″页面, 该页面描述了未找到的路由. 不存在的404路由可能是APP的bug生成, 也有可能来自外部请求.

下面将演示如何为 onUnknownRoute 属性定义匿名函数, 该函数使用了一个 RouteFactory 函数. 它是一个工厂函数, 该函数传入一个 RouteSettings 函数类型并返回一个 Route . 以下代码块将会展示定义 onUnknownRoute 属性有多简单:

onUnknownRoute: (settings) {
  return MaterialPageRoute(builder: (_) => PageNotFound());
},

PageNotFound() 是一个窗口Widget, 也就是404页面. 用于解释发生了什么, 并提供重定向至首页的入口. 你可以自由发挥自己的创造力来创建该小部件!

结语

开发Flutter APP时, 异常处理相当重要. 使用 MaterialApp , CupertinoAppWidgetApponUnknownRoute 属性可以轻松处理网站中无法避免的404错误.

感谢

本篇文章翻译自 Jose AlbaHandling 404: Page not found error in Flutter


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

天涯虚拟社区

天涯虚拟社区

刘华芹 / 民族出版社 / 2005-11 / 23.00元

网络空间很复杂,好多人并不完全了解或者只是了解到一些皮毛。比如说好多人对于见网友一事总是抱着浪漫或者暖昧的想法,而事实却并不总是想象的那样。作者在做虚拟社区研究甚至是在有这个想法之前并不常呆在网上,互联网对于作者来说就是查查资料、收发信年、看看新闻的工具。担是看着越来越多的人把时间花在网上,一处文化上的直觉告诉作者:有一种新的生活方式产生了。强烈的好奇心驱使着作者走到了网上,走到了天涯虚拟社区,并......一起来看看 《天涯虚拟社区》 这本书的介绍吧!

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试