sveltestrap 的 `listgroupitem` 等组件默认不转发 `dblclick` 事件，需通过原生 dom 包裹或事件委托实现，同时应兼顾键盘可访问性与用户体验。
在 Svelte 应用中使用 Sveltestrap（如
✅ 正确解决方案：使用原生 包裹并监听最简洁可靠的方案是用一个语义中立、无样式干扰的
包裹内容，并在其上绑定 on:dblclick：
handler(params)} class="w-100 h-100">
? 提示：添加 class="w-100 h-100"（若使用 Bootstrap/Sveltestrap 的 CSS）确保 完全覆盖 ListGroupItem 可点击区域，避免因 padding/margin 导致点击热区丢失。
⚠️ 注意事项与最佳实践
-
键盘可访问性（a11y）不可忽视：双击（dblclick）本质是鼠标专属交互，对键盘用户（如屏幕阅读器或仅用 Tab 导航的用户）不可达。应同步提供替代操作路径，例如：
- 为行添加 role="row" 和 tabindex="0"；
- 监听 on:keydown 并响应 Enter 或 Space 键：
handler(params)}
on:keydown={(e) => e.key === 'Enter' && handler(params)}
tabindex="0"
class="w-100 h-100"
>
避免滥用双击：Web UI 中双击并非标准交互范式（对比桌面应用），多数用户不会预期列表行支持双击。建议优先考虑单击打开详情、右键菜单或显式操作按钮（如“编辑”图标），以提升一致性与可用性。
-
替代思路：事件委托（高级场景）
若需批量处理大量列表项的双击逻辑，可在父容器（如 ）上使用 on:dblclick|delegate，结合 event.target 判断来源行：
{#each items as item}
...
{/each}
总之，组件事件能力取决于其内部实现，而非 HTML 标签名。遇到类似问题时，优先查阅组件源码或文档确认事件支持列表；当原生事件不可用时，合理使用 DOM 包裹 + 可访问性增强，是兼顾功能、体验与合规性的专业做法。
最简洁可靠的方案是用一个语义中立、无样式干扰的
包裹内容，并在其上绑定 on:dblclick：
|
Document Name 2.4 MB
? 提示：添加 class="w-100 h-100"（若使用 Bootstrap/Sveltestrap 的 CSS）确保 完全覆盖 ListGroupItem 可点击区域，避免因 padding/margin 导致点击热区丢失。
⚠️ 注意事项与最佳实践
-
键盘可访问性（a11y）不可忽视：双击（dblclick）本质是鼠标专属交互，对键盘用户（如屏幕阅读器或仅用 Tab 导航的用户）不可达。应同步提供替代操作路径，例如：
- 为行添加 role="row" 和 tabindex="0"；
- 监听 on:keydown 并响应 Enter 或 Space 键：handler(params)} on:keydown={(e) => e.key === 'Enter' && handler(params)} tabindex="0" class="w-100 h-100" >
避免滥用双击：Web UI 中双击并非标准交互范式（对比桌面应用），多数用户不会预期列表行支持双击。建议优先考虑单击打开详情、右键菜单或显式操作按钮（如“编辑”图标），以提升一致性与可用性。
-
替代思路：事件委托（高级场景）
若需批量处理大量列表项的双击逻辑，可在父容器（如）上使用 on:dblclick|delegate，结合 event.target 判断来源行： {#each items as item} ...
总之，组件事件能力取决于其内部实现，而非 HTML 标签名。遇到类似问题时，优先查阅组件源码或文档确认事件支持列表；当原生事件不可用时，合理使用 DOM 包裹 + 可访问性增强，是兼顾功能、体验与合规性的专业做法。
