仅在 onTap 函数上使用不同的屏幕导航

Question

当我在 flutter 中处理数据列表时，如何导航到不同的路线，在我的情况下，所有卡片都会将我导航到相同的路线。
遇到这个问题的相关代码，

Column(
  children: levelData.map((value) { 
    return Container( 
      margin: EdgeInsets.symmetric(vertical: 10.0), 
      decoration: BoxDecoration( 
        borderRadius: BorderRadius.circular(13.0),
        border: Border.all( color: AppColors().containerBorder)
      ),
      child: AppListTile(
        contentPadding: EdgeInsets.all(15.0),
        onTap: () {
         
        }, 
        title: Text(
          value['name'], 
          style: TextStyle(
            fontSize: displayWidth(context) * 0.045,
            color: AppColors().black
          ),
        ),
        subtitle: Text(
          value['description'],
          style: TextStyle(
            color: AppColors().black,
            fontSize: displayWidth(context) * 0.035
          ),
        ),
        trailing: Icon(
          Icons.arrow_forward_outlined,
          size: displayWidth(context) * 0.08,
          color: AppColors().orange,
        ),
      ),
    );
  }).toList(),
),

Answer 1

flutter的一个好处就是可以把函数存储为变量，而变量可以存储为数组。因此，您可以创建一个数组并将您希望瓷砖执行的功能存储在该数组中，每个索引应代表您现在建筑物列表瓷砖的索引。这是一个示例数组

var functionsArray = [
    (){print("hello");}, 
    (){print("hello");}, 
];

您可以按如下方式编辑代码以适合此表单：

   List<Widget> getData(levelData){
      List<AppListTile> data = []
      for(int i=0;i < levelData.length; i++){
         var tileData = levelData[i];
         Function myFunction = functionsArray[i];
         tile = AppListTile(onTap: myFunction);
         data.add(tile);
      }
      return data;
    }

仅在 onTap 函数上使用不同的屏幕导航

flutter different screen navigation using only on onTap function

provider

dart

flutter