flutter中的路由跳转

在前面的基本路由和命名路由中，都演示了如何进行路由跳转，而且在路由跳转之后，能够借用系统自带的按钮就行返回上一级，固然了，也能够自定义按钮返回上一级。

返回上一级

在前面的例子中，当从Home.dart页面跳转到Search.dart页面后，除了系统自带的返回按钮，咱们还自定义了一个按钮，而后使用Navigator.of(context).pop()开返回上一级页面。

       

路由替换

在实际项目中，仅仅上面的路由跳转和返回上一级是不能知足需求的，例如在一个项目中，有一个注册的须要，用户在用户中心点击注册按钮后，跳转到注册页面，可是咱们知道，注册是须要分几个步骤完成的：

假设注册须要分上面的三个步骤，那么当用户在第二个步骤或者第三个步骤的时候，忽然不想注册，因而点击左上角的返回，是但愿返回到用户中心，而不是上一个注册步骤，此时，仅仅依靠前面的路由跳转是不能实现的，而是要借助flutter的路由替换功能。

    

 

首先是在用户中心页面，点击注册按钮，跳转到registerFirst 的页面。

而后在registerFirst 的页面，输入手机号之后，点击下一步，跳转到registerSecond的页面。

这个时候在registerSecond的页面，点右上角的返回，退出注册时，就会返回到registerFirst 的页面，若是咱们此时想要返回到用户中心页面的话，就须要在registerFirst 的页面，使用路由替换来进行页面跳转，由于registerFirst 页面的上一级就是用户中心，当使用registerSecond页面替换registerFirst 页面的时候，registerSecond页面的上一级就是用户中心页面了。

返回根路由

好比咱们从用户中心跳转到 registerFirst 页面，而后从 registerFirst 页面跳转到 registerSecond页面，而后从 registerSecond 跳转到了 registerThird 页面。这个时候咱们想的是 registerThird注册成功后返回到用户中心。 继续采用上面的逻辑的话，就是在 registerSecond 跳转到了 registerThird 页面时，继续使用路由替换，这样，当在registerThird注册成功后，使用返回上一级的方式，就能够直接返回到用户中心了。

可是，若是不采用路由替换的话，还有没有办法，直接一步返回到根目录呢，（是返回，而不是路由跳转），在其余的框架里面可能没有办法，可是在flutter中，有一个直接返回根路由的方法，只须要咱们在registerThird页面，返回前先清空前面的路由，而后一步返回就能够了。

 可是，此时还有一个新的问题，咱们是从用户中心开始注册的，当注册完成后，是但愿能直接回到注册中心，可是在上面的操做中，直接返回到了tab的第一页面，所以，还须要继续修改Tabs.dart页面：

而后在registerThird 页面返回根目录的时候，写入须要返回tab的索引就能够了：

 代码下载：点这里（w033）