当用户返回主屏幕时关闭侧抽屉 (Flutter)

Question

在我创建的侧抽屉中，当用户单击任何链接时，用户会转到该屏幕并且抽屉也会关闭，这没有问题，而且当用户打开侧抽屉并按返回键时，抽屉会关闭，这也是工作。

然而，假设用户点击了“我的个人资料”链接（或任何链接），然后如果用户从个人资料屏幕按返回键返回主屏幕（或在应用栏中使用返回键），用户会找到侧抽屉在主屏幕上打开。然后用户必须按返回键或点击屏幕上的任意位置以关闭抽屉。

最初，我的抽屉甚至没有关闭背压，我找到了这篇文章 [https://stackoverflow.com/q/60314156] 并实施了 WillPopScope() [实际上这对我有帮助在 backpress 上关闭抽屉]，但是我已经解释过的问题仍然没有通过 WillPopScope 解决。

请让我知道我必须做哪些更改才能实现此行为。

这就是我创建文件的方式：HomePage，它具有BottomNavigationDrawer，用户通过它进入购物页面（实际上标记为“Home”），这是用户看到侧抽屉的页面。所以上面在解释当我说家时，我的意思是购物页面，从那里用户导航到个人资料页面。

class ShoppingPage extends StatefulWidget {
  @override
  _ShoppingPageState createState() => _ShoppingPageState();
}

class _ShoppingPageState extends State<ShoppingPage> {
  GlobalKey<ScaffoldState> _key = new GlobalKey<ScaffoldState>();
  @override
  Widget build(BuildContext context) {
    ThemeData getTheme = Theme.of(context);
    return WillPopScope(
      onWillPop: () async {
        if (_key.currentState.isDrawerOpen) {
          Navigator.of(context).pop();
          return false;
        }
        return true;
      },
      child: Scaffold(
        key: _key,
        appBar: AppBar(
          title: ,
          elevation: 0,
        ),
        drawer: CustomDrawer(),
        body: SafeArea(
          child: Container(

Answer 1

您只需调用 :-

Navigator.pop(context);

在从抽屉导航到另一个屏幕之前。就像当用户点击你的个人资料然后在 onTap 方法中首先弹出它然后导航一样。

onTap:(){
Navigator.pop(context);
//then write navigation statement over here
}

Answer 2

发生这种情况是因为导航抽屉仍在页面堆栈中。 当用户使用链接导航到另一个屏幕时，它会将新屏幕添加到堆栈中。

您的尝试：

WillPopScope(
      onWillPop: () async {
        if (_key.currentState.isDrawerOpen) {
          Navigator.of(context).pop();
          return false;
        }

当用户在购物屏幕上按下后退按钮时，关闭导航抽屉（如果它已打开）。

在导航到下一个屏幕之前，您需要从堆栈中移除 Navigation Drawer。你可以通过添加

来做到这一点

Navigator.pop(context);

在导航逻辑之前。

你也可以试试

Navigator.pushReplacement(context, <newRoute>)

用新屏幕替换导航抽屉，这也将产生相同的结果。

Answer 3

试试这个

imgPreviews: string[] = [];

  onClik(e) {
    this.imgPreviews.push(e.target.src);
  }