Flutter 中的 pushReplacementNamed 和 popAndPushNamed 有什么区别? [英] What is the difference between pushReplacementNamed and popAndPushNamed in Flutter?
问题描述
Flutter#navigator.dart
中的 NavigatorState
类有 2 个具有类似行为的方法.Flutter中的pushReplacementNamed
和popAndPushNamed
有什么区别?
pushReplacementNamed
通过推送名为 [routeName] 的路线替换导航器的当前路线,然后在新路线完成动画处理后处理先前的路线.
popAndPushNamed
从导航器中弹出当前路线并在其位置推送命名路线.
如果你有数据结构方面的知识,那么你就知道堆栈.如果你对stacks
有基本的了解,那么你就知道push
和pop
了.
如果你不这样做,推入是将元素添加到元素堆栈的顶部,而弹出是从同一堆栈中移除顶部元素.
所以在 Flutter 的情况下,当我们导航到另一个屏幕时,我们使用 push
方法和 Navigator
widget 将新屏幕添加到堆栈的顶部.自然地,pop
方法会从堆栈中删除该屏幕.
让我们转到
现在,当我们想要摆脱最后访问的屏幕时,在这种情况下是 Screen2
,我们需要使用 pop 从导航器的堆栈中 pop
Routes方法.
Navigator.of(context).pop();
请记住,这行代码位于您的 onPressed
方法中.
当使用 Scaffold 时,通常不需要显式弹出路由,因为 Scaffold 会自动在其 AppBar 中添加一个返回"按钮,该按钮会在按下时调用 Navigator.pop()
.即使在 Android 中,按下设备后退按钮也会执行相同的操作.但是,您可能需要将此方法用于其他用例,例如当用户单击取消"按钮时弹出 AlertDialog.
用例:pushReplacementNamed
当用户成功登录并且现在可能在 DashboardScreen
上时,无论如何您都不希望用户返回 LoginScreen
.所以登录路由应该完全被仪表板路由代替.另一个例子是从 SplashScreen
转到 HomeScreen
.它应该只显示一次,并且用户不能再次从 HomeScreen
回到它.在这种情况下,由于我们要进入一个全新的屏幕,我们可能希望将这个方法用于它的 enter 动画属性.
用例:popAndPushNamed
假设,您正在构建一个购物应用程序,该应用程序在其 ProductsListScreen
中显示产品列表,并且用户可以在 FiltersScreen
中应用过滤器.当用户单击 Apply Changes
按钮时,FiltersScreen
应该会弹出并使用新的过滤器值推送回 ProductsListScreen
.这里 popAndPushNamed
的退出动画属性看起来更合适.
pushReplacementNamed 将执行进入动画,popAndPushNamed 将执行退出动画.Navigator.of(context).pushReplacementNamed('/screen4');//和Navigator.popAndPushNamed(context, '/screen4');
欲了解更多信息,请访问 的网站Pooja_Bhaumik
The NavigatorState
class in Flutter#navigator.dart
have 2 method with the similar behavior. What is the difference between pushReplacementNamed
and popAndPushNamed
in Flutter?
pushReplacementNamed
Replace the current route of the navigator by pushing the route named [routeName] and then disposing the previous route once the new route has finished animating in.
popAndPushNamed
Pop the current route off the navigator and push a named route in its place.
If you have any knowledge in Data Structures, then you know about Stacks. If you have even basic knowledge of stacks
, then you know about push
and pop
.
If you don’t, pushing is adding element to the top of a stack of elements and popping is removing the top element from the same stack.
So in case of Flutter, when we navigate to another screen, we use the push
methods and Navigator
widget adds the new screen onto the top of the stack. Naturally, the pop
methods would remove that screen from the stack.
So lets move to the codebase of our Sample_Project and let’s see how we can move from Screen1 to Screen2
. You can experiment with the methods by running the sample app.
new RaisedButton(
onPressed:(){
Navigator.of(context).pushNamed('/screen2');
},
child: new Text("Push to Screen 2"),
),
That was short.
That was indeed. With the help of pushNamed
methods, we can navigate to any screen whose route is defined in main.dart
. We call them namedRoute
for reference. The use-case of this method is pretty straightforward. To simply navigate.
Pop it
Now when we want to get rid of the last visited screen, which is Screen2
in this case, we would need to pop
Routes from the Navigator’s stack using the pop methods.
Navigator.of(context).pop();
Remember, this line of code goes inside your onPressed
method.
When using Scaffold, it usually isn’t necessary to explicitly pop the route, because the Scaffold automatically adds a ‘back’ button to its AppBar, which would call Navigator.pop()
on pressed. Even in Android, pressing the device back button would do the same. But nevertheless, you might need this method for other usecases such as popping an AlertDialog when user clicks on Cancel button.
Use-case : pushReplacementNamed
When the user has logged in successfully, and are now on the DashboardScreen
perhaps, then you don’t want the user to go back to LoginScreen
in any case. So login route should be completely replaced by the dashboard route. Another example would be going to HomeScreen
from SplashScreen
. It should only display once and the user should not be able to go back to it from HomeScreen
again. In such cases, since we are going to a completely new screen, we may want to use this method for its enter animation property.
Use-case: popAndPushNamed
Suppose, you are building a Shopping app that displays a list of the products in its ProductsListScreen
and user can apply filters in the FiltersScreen
. When the user clicks on the Apply Changes
button, the FiltersScreen
should pop and push back to the ProductsListScreen
with the new filter values. Here the exit animation property of popAndPushNamed
would look more appropriate.
pushReplacementNamed will execute the enter animation and popAndPushNamed will execute the exit animation.
Navigator.of(context).pushReplacementNamed('/screen4');
//and
Navigator.popAndPushNamed(context, '/screen4');
For more Info visit this site of Pooja_Bhaumik
这篇关于Flutter 中的 pushReplacementNamed 和 popAndPushNamed 有什么区别?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!