Flutter Navigator 2.0 中 route.didPop(result) 何时等于 false

Posted

技术标签:

【中文标题】Flutter Navigator 2.0 中 route.didPop(result) 何时等于 false【英文标题】:When does route.didPop(result) is equal to false in Flutter Navigator 2.0 【发布时间】:2021-02-22 14:23:51 【问题描述】:

Flutter Navigator 2.0 的主要机制之一是 RouterDelegate > build > Navigator 中的 onPopPage 函数。但是,我不明白 route.didPop(result) 何时返回 false。

我们可以使用John Ryan's famous example 来显示我的问题。他的 demo code。

onPopPage: (route, result) 
  if (!route.didPop(result)) 
    return false;
  

  // Update the list of pages by setting _selectedBook to null
  _selectedBook = null;
  show404 = false;
  notifyListeners();

  return true;
,

在我所有的测试中,使用 AppBar 自动生成的后退按钮,route.didPop(result) 返回 true。

文档保留:

bool didPop(dynamic result)
package:flutter/src/widgets/navigator.dart

A request was made to pop this route. If the route can handle it internally (e.g. because it has its own stack of internal state) then return false, otherwise return true (by returning the value of calling super.didPop). Returning false will prevent the default behavior of [NavigatorState.pop].

When this function returns true, the navigator removes this route from the history but does not yet call [dispose]. Instead, it is the route's responsibility to call [NavigatorState.finalizeRoute], which will in turn call [dispose] on the route. This sequence lets the route perform an exit animation (or some other visual effect) after being popped but prior to being disposed.

This method should call [didComplete] to resolve the [popped] future (and this is all that the default implementation does); routes should not wait for their exit animation to complete before doing so.

See [popped], [didComplete], and [currentResult] for a discussion of the result argument.

但是“如果路由可以在内部处理它(例如,因为它有自己的内部状态堆栈)然后返回 false”是什么意思?路由有自己的内部状态堆栈?如何产生这个结果?

谢谢,注意安全

【问题讨论】:

【参考方案1】:

经过一些研究以完全了解 Navigator 2.0,我认为这可能是问题的答案: route.didPop(result) 将返回 false,当被要求弹出的 Route 保留本地历史条目并且必须在弹出完整 Route 之前将其删除。

那么什么是本地历史条目(内部状态堆栈)?

本地历史条目是在页面内实现本地导航的一种方式。您可以使用方法addLocalHistoryEntry 来执行此操作。为了更好地理解这一点,请查看官方 Flutter Docs 示例:

以下示例是一个有 2 个页面的应用:HomePage 和 SecondPage。 HomePage 可以导航到 SecondPage。 SecondPage 使用 LocalHistoryEntry 在该页面内实现本地导航。 按“显示矩形”显示一个红色矩形并添加一个局部 历史条目。此时,按下“

class App extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      initialRoute: '/',
      routes: 
        '/': (BuildContext context) => HomePage(),
        '/second_page': (BuildContext context) => SecondPage(),
      ,
    );
  


class HomePage extends StatefulWidget 
  HomePage();

  @override
  _HomePageState createState() => _HomePageState();


class _HomePageState extends State<HomePage> 
  @override
  Widget build(BuildContext context) 
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Text('HomePage'),
            // Press this button to open the SecondPage.
            ElevatedButton(
              child: Text('Second Page >'),
              onPressed: () 
                Navigator.pushNamed(context, '/second_page');
              ,
            ),
          ],
        ),
      ),
    );
  


class SecondPage extends StatefulWidget 
  @override
  _SecondPageState createState() => _SecondPageState();


class _SecondPageState extends State<SecondPage> 

  bool _showRectangle = false;

  void _navigateLocallyToShowRectangle() async 
    // This local history entry essentially represents the display of the red
    // rectangle. When this local history entry is removed, we hide the red
    // rectangle.
    setState(() => _showRectangle = true);
    ModalRoute.of(context).addLocalHistoryEntry(
        LocalHistoryEntry(
            onRemove: () 
              // Hide the red rectangle.
              setState(() => _showRectangle = false);
            
        )
    );
  

  @override
  Widget build(BuildContext context) 
    final localNavContent = _showRectangle
      ? Container(
          width: 100.0,
          height: 100.0,
          color: Colors.red,
        )
      : ElevatedButton(
          child: Text('Show Rectangle'),
          onPressed: _navigateLocallyToShowRectangle,
        );

    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            localNavContent,
            ElevatedButton(
              child: Text('< Back'),
              onPressed: () 
                // Pop a route. If this is pressed while the red rectangle is
                // visible then it will will pop our local history entry, which
                // will hide the red rectangle. Otherwise, the SecondPage will
                // navigate back to the HomePage.
                Navigator.of(context).pop();
              ,
            ),
          ],
        ),
      ),
    );
  

要查看文档中的示例,请点击here。

我希望我以一种可以理解的方式回答了这个问题。

【讨论】:

天啊,根据你的标点错误,我猜你来自德国,我检查了你的个人资料,你实际上来自那里。我太棒了:) Sherlock :) 伙计,这些错误是如此严重,以至于它们暴露了我的出身 xD?

以上是关于Flutter Navigator 2.0 中 route.didPop(result) 何时等于 false的主要内容,如果未能解决你的问题,请参考以下文章

Flutter Navigator 2.0 页面过渡

Flutter Navigator 2.0 中 route.didPop(result) 何时等于 false

Navigator 2.0 和抽屉

Flutter:Navigator2.0介绍及使用

Flutter 路由

Flutter 路由我定