我正在尝试使用 react-tooltip 库向我的应用程序添加工具提示功能。我遇到的问题是传递className
或class
prop不会导致class
属性添加到相应的div
元素。在研究库代码和调试一段时间后,我仍然不知道为什么没有添加它。似乎是库中的错误(我在这里发布了错误报告),但我不排除我忽略某些东西的可能性,因此也在这里发布。
反应工具提示的版本:4.2.21
反应代码:
// App.js
useEffect(() => {
ReactTooltip.rebuild()
}, [])
// MyTooltip.js
import ReactTooltip from "react-tooltip";
import ReactDOM from "react-dom";
import React from "react";
import classes from './MyTooltip.module.css';
const MyTooltip = (props) =>
<React.Fragment>
{
ReactDOM.createPortal(
<div>
<div className={classes.backdrop} />
<ReactTooltip
id={props.id}
type="dark"
place={props.place}
className={classes.tooltip}
>
<span>{props.text}</span>
</ReactTooltip>
</div>
,
document.getElementById("tooltip")
)}
</React.Fragment>
export default MyTooltip;
生成的 HTML:<div class="__react_component_tooltip t724ff40a-5699-4bf1-9fd7-7295f4f8e414 place-bottom type-dark" data-id="tooltip"><span>Test tooltip</span></div>
提前感谢您提供任何有助于解决此问题的提示。