第三百七十六回


我们在上一章回中介绍了在页面之间共传递数据相关的内容,本章回中将介绍如何拦截路由.闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1 .概念介绍

本章回中介绍的路由拦截是指在路由运行过程中,对路由做一些处理。在Flutter中通过路由来实现页面之间的跳转,如果想在跳转过程中做一些事情怎么办呢?那么就
需要路由拦截了。本章回中将详细介绍如何实现路由拦截。

2. 实现方法

通常情况下路由都存放在MaterialApp组件的routes属性中,我们也叫它路由表,该表中的内容明确指出了路由的方向,如果遇到一些不在路由表中的路由,不知道它
的方向,那么就可以对这种路由进行拦截。MaterialApp组件提供了两个属性:onGenerateRoute和onUnknownRoute。这两个属性都是方法类型,详细如下:

  • 方法返回的值就是路由的方向,或者说路由跳转到的页面;
  • 方法的参数中包含路由参数中内容,比如路由名称,路由参数等;
  • onGenerateRoute属性优先于onUnknownRoute执行;
  • 如果onGenerateRoute属性已经拦截了路由,那么onUnknownRoute属性不再重复拦截;
    最后我在强调一下,这两个属性对应的方法只能拦截不在路由表中的路由,而且需要和pushNamed方法配合使用才可以。稍后我们将通过示例代码来演示。

3. 示例代码

///主要用来拦截不在routes属性中定义的路由,需要和pushNamed方法配合使用才能回调该属性对应的方法
onGenerateRoute:(settings) {
  if(settings.name == 'SecondRouter') {
    debugPrint('setting: ${settings.toString()}');
    return MaterialPageRoute(builder: (context){
      return SecondRouter(data: 'data from home');
    },
        ///如果路由中包含参数,一定要给这个属性赋值,不然路由中的参数为null
        settings: settings);
  }else {
    debugPrint('setting: ${settings.toString()}');
    return null;
  }
},
///主要用来拦截不在routes属性中定义的路由,需要和pushNamed方法配合使用才能回调该属性对应的方法
///优先级低于onGenerateRoute,只有onGenerateRoute方法返回Null时才回调此属性对应的方法
onUnknownRoute: (settings) {
  debugPrint('unknown setting: ${settings.toString()}');
  return MaterialPageRoute(builder: (context){
    ///这里可以创建一个未知错误的界面,遇到未知路由则跳转到该界面
    return SecondRouter(data: 'data from home');
  });
},

onPressed: () {
  debugPrint('second router clicked');
  ///创建两个路由,SecondRouter不会被拦截,因为routers属性对应的路由表中有该属性
  ///ThirdRouter会被拦截,因它不在路由表中,先是onGenerateRoute拦截,但是没有处理,转到onUnknownRoute中
  Navigator.pushNamed(context, 'SecondRouter',arguments: 'data from arguments');
  Navigator.pushNamed(context, 'ThirdRouter',arguments: 'data from arguments');
}

上面的代码中给出了路由拦截的代码,并且添加了详细的注释。onPressed属性中的代码可以放到Button中,这样可以在点击按钮的时候进行通过路由来跳转。代码中
拦截拦截路由后只打印出了路由中的参数,大家可以依据项目需求在这里添加一些业务逻辑。这里只列出了核心代码,完整的代码可以到Github上查看main.dart文件。
看官们,关于"如何拦截路由"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

talk_8

真诚赞赏,手有余香

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值