如何 return 来自使用 bottom sheet 的自定义函数的数据

Question

我创建了一个自定义函数，可以在 flutter 中打开模态底部 sheet。现在，我想将一些数据从 sheet 返回到我的上一页。我应该怎么做？我试图将函数的 return 类型设为 Future<FilterDataModel> 和 Future，但它不起作用。我希望每当用户点击取消时，它应该 return false 并且当他按下应用时，我应该对数据进行 true。

这是我试过的 -

Future<FilterDataModel> showFilterBottomSheet<T>(
    {required BuildContext context}) async {
  
  Some code ...........

  FilterDataModel filterData = FilterDataModel();

  showModalBottomSheet(
    context: context,
    isScrollControlled: true,
    builder: (context) {
      String val = "One";
      return StatefulBuilder(
        builder: (context, StateSetter setState) {
          return Wrap(
            children: [
              Padding(
                padding: EdgeInsets.symmetric(
                  vertical: getProportionateScreenHeight(20),
                  horizontal: getProportionateScreenWidth(16),
                ),
                child: Column(
                  ..............
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          child: InkWell(
                            onTap: () {
                              Navigator.pop(context, [false, filterData]);
                            },
                            child: Container(
                              decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(8),
                                border: Border.all(color: Colors.white),
                              ),
                              padding: EdgeInsets.symmetric(
                                vertical: getProportionateScreenHeight(16),
                              ),
                              child: Center(
                                child: Text(
                                  'Cancel',
                                  style: TextStyle(
                                    color: primaryText2,
                                    fontSize: 16,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                        SizedBox(
                          width: getProportionateScreenWidth(20),
                        ),
                        Expanded(
                          child: InkWell(
                            onTap: () {
                              Navigator.pop(context, [true, filterData]);
                            },
                            child: Container(
                              decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(8),
                                border: Border.all(color: Colors.black38),
                              ),
                              padding: EdgeInsets.symmetric(
                                vertical: getProportionateScreenHeight(16),
                              ),
                              child: Center(
                                child: Text(
                                  'Apply',
                                  style: TextStyle(
                                    color: primaryOrange,
                                    fontSize: 16,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ],
          );
        },
      );
    },
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(16.0),
    ),
  ).then((value) {
    debugPrint("Coming data");
    debugPrint(filterData.academicYear.toString());
    return filterData;
  });
  return filterData;
}

以及我如何称呼它 -

onPressed: () async {
              FilterDataModel f = await showFilterBottomSheet(
                context: context,
              );
              print("Here - ${f.academicYear}");
            },

我也试过这样做-

onPressed: () async {
              await showFilterBottomSheet(
                context: context,
              ).then((value) {
                print("Inside then");
                print(value[0]);
                print(value[1].toString());
              });
              print("Here - ${f.academicYear}");
            },

但是没用。

Answer 1

看起来当你弹出导航器时你 return List< dynamic> (boolean + filterDataModel)

所以方案是：

final result = await showModalBottomSheet<dynamic>(){
   ...
   ... 
     return YourWidget(
       ...
       onTap: ()=> Navigator.of(context).pop([false, filterDataModel])
       ...
     )
}
final boolResult = result[0] as boolean;
final dataResult = result[1] as FilterDataModel;`

请注意，如果模态是可关闭的，那么 return 将为 null，以防它在没有 returned 值的情况下被关闭，您也必须处理这种情况

Answer 2

您需要等待底部 sheet，以获取从 Navigator.pop(context, value) 返回的结果。所以它会像。

final res = await showModalBottomSheet(context, ....);
/// this is to make sure that the Navigator.pop(context) from the bottom sheet did not return a null.
if (res != null) {
   FilterDataModel filterData = FilterDataModel();
   return filterData;
} else {
   return anything;
}

如何 return 来自使用 bottom sheet 的自定义函数的数据

How to return data from custom function which uses bottom sheet in flutter

dart

flutter