Flutter - 导航到一个新的屏幕，并清除所有先前的屏幕。

11 浏览
0 Comments

Flutter - 导航到一个新的屏幕，并清除所有先前的屏幕。

我使用Navigator.push跳转了6个页面才进入到支付页面。支付完成后，我想要跳转到“支付成功”页面，然后移除掉所有之前的页面，也就是说使用返回按钮会返回到最初的页面。

注意：我已经尝试过pushReplacementNamed，但它不起作用。

0

3 答案

0 Comments

问题原因：需要在Flutter中导航到一个新的屏幕，并清除所有先前的屏幕。

解决方法：通过调用SchedulerBinding.instance.addPostFrameCallback()方法，可以在当前持久帧的末尾安排一个回调，以在渲染所有帧后导航到指定页面。在回调函数中，使用Navigator.of(context).pushNamedAndRemoveUntil()方法来推送到/loginPage路由，并删除所有先前的路由。

以下是完整的解决方案代码：

SchedulerBinding.instance.addPostFrameCallback((_) {

Navigator.of(context).pushNamedAndRemoveUntil(

'/loginPage', (Route route) => false);

});

通过以上代码，即可在Flutter中实现导航到一个新的屏幕，并清除所有先前的屏幕。

0
0 Comments

Flutter中，导航到一个新的屏幕并清除所有先前的屏幕的问题是由于需要在导航到新屏幕时，同时清除之前的屏幕而引起的。以下是解决这个问题的方法：

你可以使用Navigator.pushAndRemoveUntil方法来实现这个功能。该方法接受三个参数：context、新屏幕的构建器函数和一个返回布尔值的回调函数。回调函数用于确定是否应该移除之前的屏幕。

下面是一个示例代码，演示了如何使用pushAndRemoveUntil方法导航到新屏幕并清除之前的屏幕：

Navigator.pushAndRemoveUntil<dynamic>(

context,

MaterialPageRoute<dynamic>(

builder: (BuildContext context) => YourPageNameGoesHere(),

),

(route) => false, // 设置为false以禁用返回功能

);

在上述代码中，builder函数指定了新屏幕的构建方法。你需要将YourPageNameGoesHere替换为你要导航到的具体页面的名称。

回调函数(route) => false表示不允许返回到之前的屏幕，也就是清除之前的屏幕。

通过使用上述代码，你可以在导航到新屏幕的同时清除之前的屏幕。这对于一些特定的应用场景非常有用，例如登录后不允许返回到登录页面等。

希望这个解决方法对你有帮助！

0
0 Comments

问题的原因是要实现在导航到新屏幕时清除所有先前的屏幕。解决方法是使用Flutter中的Navigator.pushAndRemoveUntil函数，并将新屏幕作为newRoute参数传递，将要清除的屏幕路由作为predicate参数传递。

解决方法的示例代码如下：

_navPaymentSuccessful(){

Navigator.pushAndRemoveUntil(

context,

MaterialPageRoute(

builder: (context) => PaymentSuccessful()

),

ModalRoute.withName("/Home")

);

}

在这个代码示例中，使用Navigator.pushAndRemoveUntil函数导航到新屏幕PaymentSuccessful，并指定要清除的屏幕路由为"/Home"。

使用ModalRoute.withName('/Home')作为predicate参数的目的是在按下返回按钮时确保用户导航到"/Home"屏幕。ModalRoute.withName('/Home')用于返回一个RoutePredicate，用于移除直到具有特定名称的路由。这样可以确保按下返回按钮时，用户将回到指定的屏幕。

如果要导航到根屏幕，可以将"/Home"替换为"/"。还可以使用MaterialPageRoute的settings属性为MaterialPageRoute提供路由参数，例如：settings: RouteSettings(arguments: myArgs)。

在这个问题的解答中，还提到了一个视频教程链接，链接地址是https://www.youtube.com/watch?v=Ae7m9JHhi7Y&ab_channel=LearnwithShajeel。

另外，还有一位开发者提到，不需要指定路由为"/"，只需使用一个predicate (_) => false。这是一个示例代码：

Navigator.pushAndRemoveUntil(context, MaterialPageRoute(builder: (context) => LoginPage()), (_) => false);

以上就是关于Flutter中导航到新屏幕并清除所有先前屏幕的问题原因和解决方法的整理。

0