使用 switchcase 的 Flutter Navigation答案

【问题标题】：Flutter Navigation using a switchcase使用 switchcase 的 Flutter Navigation
【发布时间】：2022-12-29 21:05:34
【问题描述】：

我正在其中构建一个包含 20 个列表的列表视图，一旦构建了这个列表视图，我希望每个列表图块都有不同的页面，我还想要一种方法来分别导航到这些页面中的每一个。

我正在考虑使用 switch case 并将列表的索引用于将根据单击的索引决定导航的条件。

final List<Map<String, dynamic>> _av_all_listtiles = [
    {
     
      "id": 1,
      "name": "label 1",
    },
    {
      
      "id": 2,
      "name": "label 2",
    },
    {
    
      "id": 3,
      "name": "label 3",
    },

ListView.builder(
                            
                            
                              itemCount: _av_searched_listiles.length,
                              itemBuilder: (context, index) => 
                                child: Card(
                                  borderOnForeground: true,
                                  elevation: 8,
       
                                  child: Container(
                                    height: 44.h,
                                    child: ListTile(
                                      
                                       onTap: () {
                                           Navigator.push(
                                           context,
                                           MaterialPageRoute(
                                           builder: (context) =>
                                           // here i want some kind of function or conditioon based on which it will navigate

                                           deposit_screen()),
                                         );
                                       },
                                    ),
                                  ),
                                ),
                              ),
                            ),

我试图使功能正常，但没有用

【问题讨论】：

为什么需要多屏导航？这是场景要求还是您遗漏了什么？

标签： flutter routes conditional-statements widget

【解决方案1】：

您可以像这样使用 switch case 进行导航：

ListView.builder(
      itemCount: _av_all_listtiles.length,
      itemBuilder: (context, index) => Card(
        borderOnForeground: true,
        elevation: 8,
        child: Container(
          height: 44.h,
          child: ListTile(
            onTap: () {
              var screen = deposit_screen();
              switch (index) {
                case 0:
                  screen= deposit_screen();
                  break;
                case 1:
                  screen= deposit_screen1();
                  break;
                case 2:
                  screen= deposit_screen2();
                  break;
              }
              Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => screen
                ),
              );
            },
          ),
        ),
      ),
    )

【讨论】：