如何点击 vue.js v-tooltip 中的链接 (<a></a>)？可以做吗？

Question

在我的 vue.js 应用程序中，我正在实现一个带有 v-tooltip 的 vue.js 组件，以显示其包含多个条目的内容。其中一个条目是锚链接。工具提示使用鼠标悬停来工作，因此一旦鼠标悬停在项目之外，工具提示就不再可见。如何解决该问题以便可以单击工具提示内的链接？ 这是我的 vue.js 组件

Vue.component('标签提供者项目', { 道具：['项目']， template:'tooltip.top="{show: item.pageingNote || !item.pagerId, 内容：createTooltipHtmlContent（项目）， 触发器：'悬停'}">

{{item.label}}

'方法：{>createTooltipHtmlContent： 创建TooltipHtmlContent } } );

Answer 1

首先，这不是好的用户体验。
工具提示应该只提供信息而不是交互。

同时，您可以通过以下方式解决该问题：

• 放置比元素本身更大的悬停区域，
• 或者在工具提示隐藏之前留出一些时间，让用户有时间点击它
• 或将“仅悬停”的行为更改为使工具提示元素可点击

---

TLDR：不要这样做，因为这会带来不好的后果：

• 移动支持
• 辅助功能
• 易于使用
• 熟悉，谁点击过这样的东西？