如何使用 *BOTTOM NAVIGATION BAR* 处理 Flutter 上的 *CUSTOM* 后退按钮？

Question

我在 flutter 中有一个底部导航栏：

class _HomeState extends State<Home> {
 int index = 1;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: CurvedNavigationBar(
        index: index,
        items: barItems,
        onTap: (index) {
          setState(() {
          this.index = index;
        });
...
...
 );
  }
}

其中 barItems 是小部件列表。

导航栏的一个屏幕正在路由到另一个屏幕，a 想制作一个返回到上一个屏幕的自定义后退按钮：

 GridView.count(
        shrinkWrap: true,
          crossAxisCount: 2,
          mainAxisSpacing: 10,
          crossAxisSpacing: 10,
          padding: const EdgeInsets.all(5),
          children: _allSongs.map((currentSong) {
            return InkWell(
              onTap: ()=> Navigator.pushReplacementNamed(context, '/singleSong', arguments: currentSong),
              ...
              ...)

在那个新屏幕上我有一个自定义后退按钮：

child: Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
            margin: const EdgeInsets.only(left: 10),
            child: IconButton(
                onPressed: () {
                  **Navigator.of(context).pop();**
                  
                },
                icon: const Icon(Icons.arrow_back_ios))),
        

我也添加了所有必要的路由，但是当单击该按钮时，我得到的只是一个空白的黑屏。

有什么帮助吗？ 谢谢

Answer 1

在新页面中，您正在使用Navigator.pushReplacementNamed(context, '/singleSong', arguments: currentSong)转到新页面。同时还将主路由（“/”）替换为新路由（“/singleSong”）。

如果您尝试从那里返回，将没有任何可用的路线，因为您已将“/singleSong”作为主路线。

所以，而不是

Navigator.pushReplacementNamed(context, '/singleSong', arguments: currentSong)

你应该使用

Navigator.pushNamed(context, '/singleSong', arguments: currentSong)