问题标签 [v-tooltip]

我有两个工具提示，一个在外部元素上，另一个在内部元素上，如下所示：

显示内部工具提示时如何删除外部工具提示？

这是一个小提琴

代码非常标准，但请记住，有时v-tooltip会像模态一样放置工具提示 - 在正文级别，因此工具提示实际上可能没有嵌套。

这是我尝试过的：

在外部工具提示上，我放了一个这样的类：

然后在内部工具提示上：

但我得到一个错误：

渲染错误：“TypeError：$(...).close 不是函数”

我试过这样：.close;- 就像 close 不是一个函数 - 但什么也没发生，甚至没有错误。

我正在寻找一种更优雅或更标准的方法来做到这一点。为每个嵌套的工具提示集添加一个类和一个方法需要一段时间。

我使用 Vue、vue-fontawesome 和 v-tooltip。我只是尝试做的是：

但这不起作用，作为字符串传递的组件不会被渲染。如何轻松完成？

<button v-tooltip="'text'" :disabled=true>Some button</button>

我需要tooltip解释为什么按钮被禁用，但是当我这样做时，tooltip它也被禁用。

我想传递一个没有任何值的属性 - 只有名称。我希望名称根据道具是动态的。

我想创建一个工具提示组件，以获取工具提示侧 -> 左上角或右下角。在 v-tooltip 中没有属性side，所有 side 都是另一个没有价值的属性。我希望它根据道具进行更改（侧是一个变量 - 我的组件的道具）。

我找不到使用 prop 作为属性名称的方法

我正在尝试有条件地显示v-tooltip基于布尔值的 a。这是我目前拥有的：

我不想动态显示不同的工具提示文本。我想确定是否显示实际的工具提示。我尝试了以下三元但没有成功：

当用户将鼠标悬停在 div 上时，我正在使用 v-tooltip 显示一些内容。它在开发中工作没有问题。

但是，当我为生产环境构建它并转移到 prod 环境时，自定义 css 不适用于我的工具提示。

我使用的 v-tooltip 版本是 ^2.0.0-rc.33

以下是我的代码。

我正在使用以下 CSS

使用 v-tooltip 指令。当工具提示打开时，popper.js 会尝试根据周围空间找到合适的位置（至少我是这样理解的），并将这些信息暴露在 x-placement 属性上。如何在 Vue 中获取放置信息并使用它 - 例如将其公开为 css 类（原因之一是某些浏览器（例如 IE）在 css 属性选择器方面存在性能问题）。

我设法使用 popper.js 自定义修饰符让我的案例工作，但我想知道是否有更多 Vue 方法来做到这一点。

https://jsfiddle.net/xhwL2sme/1/

我正在使用 Vuetify 在 Vue 应用程序中工作。我正在尝试在 v-list-tile-avatar 元素周围添加一个 v-tooltip，其中包含一个图像，如下所示：

但这似乎使头像图像消失了。

在没有工具提示的情况下，我检查了头像元素，我看到了：

使用工具提示，我看到了这个：

这里发生了什么？

我正在尝试在我的 Vue 应用程序中的自己的组件中实现 v-tooltip https://www.npmjs.com/package/v-tooltip但是当我悬停元素并且我没有得到任何东西时它目前没有做任何事情控制台错误，我不知道我是否正确实施它，并希望能得到任何帮助。在同一个应用程序中，我创建了一个名为 TooltipBoot.vue 的组件，我正在使用引导工具提示，这个组件工作得很好，所以我尝试使用 v-tooltip 进行类似的设置，但 v-tooltip 不是工作。

这是我的 TooltipBoot.vue 组件，它可以工作：

然后我在其他地方导入并使用我的组件：

所以我尝试使用 v-tooltip 做类似的事情，这是我的 VTooltip.vue 组件：

然后我尝试使用该组件：

但是当我将文本悬停时没有任何反应，我错过了什么吗？或者这不是实现这个包的方法吗？谢谢！

图片 如何制作这样的东西？我曾尝试使用 v-tooltip 和 Vuetify，但没有成功。将#body 的背景颜色设为灰色并且没有其他解决方案是最佳选择吗？