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

如何简化SfCalendar点击仅选预约且移除单元格点击边框的实现?

更简便的实现方式

你可以通过以下方式简化代码,直接达成仅允许选中预约、禁用单元格选中的需求:

  • 设置selectionMode为CalendarSelectionMode.none,直接关闭日历的默认单元格选中功能,省去手动清空选中状态的步骤
  • 在onTap回调里仅处理预约元素的点击事件

简化后的代码示例:

SfCalendar(
  // ... 你的其他配置属性
  selectionMode: CalendarSelectionMode.none, // 禁用默认单元格选中
  onTap: (details) {
    if (details.targetElement == CalendarElement.appointment) {
      // 你的预约选中逻辑写在这里
    }
  },
)

优势说明

原本的实现需要手动重置非预约点击的选中状态,而通过selectionMode: none直接禁用了日历自带的单元格选中机制,代码逻辑更简洁直观,无需额外的状态回滚操作。

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.07.13 07:56:15