You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter自定义卡片点击时Route路由不响应,该如何排查问题?

问题根因

你的pressn参数仅被声明为CardsParent组件的入参,没有绑定到任何可响应点击/触摸事件的控件上,所以点击操作无法触发你传入的路由跳转逻辑,确实需要额外绑定事件。

修复方案

有两种常用实现方式,可按需求选择:

  • 方案1:整个卡片区域可点击,带点击水波纹效果
    在Card外层包裹InkWell控件,将onTap属性绑定为widget.pressn即可,修改后的组件代码如下:
// 仅展示修改后的build方法,其余代码保持不变
@override
Widget build(BuildContext context) {
  return Container(
    width: 140,
    height: 100,
    child: InkWell(
      onTap: widget.pressn,
      // 圆角和Card保持一致,保证水波纹效果边界正确
      borderRadius: BorderRadius.circular(15.0),
      child: Card(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(15.0),
        ),
        color: Colors.white,
        elevation: 10,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            ListTile(
              leading: Icon(
                widget.icon,
                size: 50,
                color: kOrangeColor,
              ),
              title: Text(widget.title,
                  style: TextStyle(fontSize: 14.0, color: kOrangeColor)),
              subtitle: Text(widget.subtitle,
                  style: TextStyle(fontSize: 11.0, color: kOrangeColor)),
            ),
          ],
        ),
      ),
    ),
  );
}
  • 方案2:仅ListTile区域可点击
    直接给ListTile控件的onTap属性绑定widget.pressn即可:
ListTile(
  onTap: widget.pressn, // 新增这一行即可
  leading: Icon(
    widget.icon,
    size: 50,
    color: kOrangeColor,
  ),
  title: Text(widget.title,
      style: TextStyle(fontSize: 14.0, color: kOrangeColor)),
  subtitle: Text(widget.subtitle,
      style: TextStyle(fontSize: 11.0, color: kOrangeColor)),
)

可选优化:如果需要兼容pressn未传的场景,可将onTap写法调整为onTap: widget.pressn ?? () {}避免空指针异常。

内容的提问来源于stack exchange,提问作者isofttechn

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.18 15:06:06