问题标签 [react-tooltip]

所以我正在使用 next.js 并尝试使用 ReactTooltips 制作工具提示，以向用户显示该按钮实际上已添加。然而似乎虽然工具提示工作正常，但它现在取消了“onClick”功能。谁能帮我解决这个问题？

我想根据一些逻辑显示工具提示，这意味着我将执行 ReactTooltip.show 以手动显示工具提示。

截至目前，文档中的示例提到将目标的引用传递给函数，这在我的情况下不起作用。

这是我创建的代码沙箱的链接，显示了我的代码的示例结构：https ://codesandbox.io/s/reacttooltip-sandbox-ovzfe

单击显示工具提示 3 未在下面的 p 标签上显示工具提示。

我目前正在为我的反应项目使用react-tooltip，我遇到了一个问题，它是工具提示不能覆盖在其他容器（div）上，当其他容器有animation-fill-mode: forwardsCSS 规则时会发生这种情况，我试图更改 z-index 属性以解决问题，但它没有工作，这是它目前的样子：

这就是它的样子：

它下面的 div 不允许它显示在它上面，它具有以下 CSS 类：

这个问题可以通过删除animation-fill-mode: forwards规则来解决，但我需要它，因为这是一个入门动画，所以有没有其他选择？

这里有点奇怪。我的网站几乎完成了，只有一个问题。我已经实现了工具提示，但它们仅在我刷新页面后才会显示！这是重现该问题的 GIF：

https://i.imgur.com/NbHyN77.mp4

该软件包来自 NPM，位于以下链接：https ://www.npmjs.com/package/react-tooltip

我浏览了他们的文档、故障排除和在他们的 github 存储库上报告的问题，但没有任何内容描述我的问题。该网站位于：https ://ezekias1337.github.io/Burning-Crusade-Talent-Calculator/#/

奇怪的是，如果我为其中一条路线添加书签并将其加载到新选项卡中，它会第一次加载。仅当我从图标中选择组件时才会出现此问题。

我确保从“react-tooltip”导入 ReactTooltip；我还在每个组件的底部和 app.js 中添加了。添加 data-for 属性并没有解决问题。

这是我的 App.js 的代码：

以下是与每个单独组件中的工具提示相关的代码：

a.) 具有工具提示的图像（每个图像都有唯一的工具提示）

b.) 组件的底部

知道我能做些什么来解决这个问题吗？

我有 ReactTable，它使用 ReactTooltip 并在工具提示中显示该行值的工具提示。但我想在该工具提示中显示另一行的值。我怎么能这样做？我的代码是：

在我想显示另一行的 Test1 值。请给我建议。

我有一个react-table表（为方便起见包装在自定义Table组件中），其中最后一列包含按钮。这些操作支持react-tooltip工具提示。

在 Action 列中，正确获取data-tip了按钮的工具提示，

当我最初在表格的第 1 页时，React-Tooltip 有效（如下图黑色所示）。我看到黑色工具提示和白色默认“alt”框。

但是一旦我导航到不同的页面，React-Tooltip 就会停止工作：

甚至当我回到原来的第 1 页时，它也不再起作用了：

React-Table 包装器实现取自https://react-table.tanstack.com/docs/overview示例。本质上它具有结构

我正在尝试使用 react-tooltip 库向我的应用程序添加工具提示功能。我遇到的问题是传递className或classprop不会导致class属性添加到相应的div元素。在研究库代码和调试一段时间后，我仍然不知道为什么没有添加它。似乎是库中的错误（我在这里发布了错误报告），但我不排除我忽略某些东西的可能性，因此也在这里发布。

反应工具提示的版本：4.2.21

反应代码：

生成的 HTML：<div class="__react_component_tooltip t724ff40a-5699-4bf1-9fd7-7295f4f8e414 place-bottom type-dark" data-id="tooltip"><span>Test tooltip</span></div>

提前感谢您提供任何有助于解决此问题的提示。

我正在使用 react-tooltip 显示多行工具提示，但问题是文本默认居中，如何将文本左对齐

我想为使用 react-tooltip 的每个选项显示工具提示，我尝试了下面的代码，该代码可以很好地在鼠标悬停时显示工具提示，但是在 keydown 和 keyup 箭头上它不起作用，因为焦点永远不会出现在内部子 div 上，它我创建如下...在这里，我使用工具提示 div 更新选项

总是有一个父 div creted，`

我的问题是，我们可以在修改选项时控制那个外部 div HTML。或者请建议我是否遵循错误的方法。

我有以下代码：

问题是当我取消最大化浏览器窗口时，当光标位于浏览器窗口之外时，工具提示会消失。如果发生滚动，工具提示也会消失。我必须将光标指向导航栏，然后返回 webapp 以在滚动后再次显示工具提示。

无论如何，我怎样才能让 react-tooltip 始终可见？

提前致谢。