使用persistent_bottom_nav_bar包实现退出登录后导航至标题页：清除路由栈并隐藏底部导航栏的问题咨询

我来帮你搞定这个问题！结合persistent_bottom_nav_bar的特性，我们可以通过以下方式同时解决你遇到的两个问题：

核心思路 #

要实现退出登录后清空所有路由栈，并且跳转至隐藏底部导航栏、无多余AppBar的标题页，最直接的方式是使用Navigator.pushAndRemoveUntil——它既能替换整个路由栈，又能确保新页面成为栈中唯一的页面，按下返回键会直接退出应用（不会回到之前的登录状态页面）。

具体代码实现 #

1. 退出登录时的跳转逻辑

在你的退出登录方法中，替换成这段代码：

// 执行完退出登录的业务逻辑（比如清除用户信息）后，执行跳转
Navigator.of(context).pushAndRemoveUntil(
  MaterialPageRoute(builder: (context) => const TitlePage()),
  (Route<dynamic> route) => false, // 这个条件会清除所有之前的路由
);

2. 确保标题页符合需求

你的TitlePage需要是一个独立的页面，不要嵌套在persistent_bottom_nav_bar的导航结构中，并且根据需求去掉AppBar：

class TitlePage extends StatelessWidget {
  const TitlePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 不要添加AppBar，避免显示不需要的顶部栏
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: const [
            Text('欢迎来到标题页'),
            // 这里可以添加登录按钮等其他内容
          ],
        ),
      ),
    );
  }
}

为什么之前的方法有问题？ #

• 第一个方法（pushNewScreen）：只是在现有路由栈顶部添加了标题页，之前的页面仍然保留在栈中，所以按下返回键会回到登录前的页面。
• 第二个方法（popUntil+pushReplacement）：虽然回到了根路由并替换，但如果你的根路由是带有persistent_bottom_nav_bar的页面，可能会导致底部导航栏仍然显示；另外如果TitlePage本身没处理好AppBar，就会出现你说的不符合需求的情况。

内容的提问来源于stack exchange，提问作者Shashank Deepak