如何使用 *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 是小部件列表。

導航欄的一個屏幕正在路由到另一個屏幕，想要為前一個屏幕制作自定義后退按鈕：

 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)到 go 到新頁面。 同時，它還將主路由（“/”）替換為新路由（“/singleSong”）。

如果您嘗試從那里返回 go，由於您已將“/singleSong”作為主要路線，因此不會有任何路線可供您使用。

所以，而不是

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

你應該使用

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