0

我正在尝试使用 react-tooltip 库向我的应用程序添加工具提示功能。我遇到的问题是传递classNameclassprop不会导致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>

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

4

0 回答 0