Flutter如何在作为参数传入的Function()执行前后插入自定义代码

你不需要直接把外部传入的onPressed透传给ElevatedButton，自己包一层中间处理函数，就可以自由控制内部逻辑和外部回调的执行顺序。

注意：如果你的内部逻辑要调用setState，需要先把原来的StatelessWidget改成StatefulWidget。

方案1：先执行内部逻辑，再运行外部回调 #

// 改为StatefulWidget支持setState操作
class AppButton extends StatefulWidget {
  final Function()? onPressed;

  const AppButton({
    Key? key,
    required this.onPressed
  }): super(key: key);

  @override
  State<AppButton> createState() => _AppButtonState();
}

class _AppButtonState extends State<AppButton> {
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      // 绑定自定义的中间处理函数
      onPressed: () {
        // 优先执行内部逻辑，比如修改组件内部状态
        setState(() {
          // 你的内部处理代码
        });
        // 内部逻辑执行完成后调用外部传入的回调，?.call()可自动判空
        widget.onPressed?.call();
      }
    );
  }
}

方案2：等外部回调执行完成后再运行内部逻辑 #

如果外部回调是异步函数，需要给中间函数加async/await保证等异步逻辑跑完再执行内部代码：

class _AppButtonState extends State<AppButton> {
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () async {
        // 先执行外部传入的回调，异步逻辑加await等待执行完成
        await widget.onPressed?.call();
        // 外部回调跑完后执行内部逻辑
        setState(() {
          // 你的内部处理代码
        });
      }
    );
  }
}

注意事项 #

• 调用外部回调时统一用?.call()写法，就算外部传入的onPressed为null也不会触发空指针异常
• 如果需要等待外部异步回调执行完成，必须加await，否则内部逻辑会在异步回调挂起时直接执行

内容的提问来源于stack exchange，提问作者lxknvlk