使用Tooltip.js渲染React组件

时间:2018-07-11 13:31:30

标签: reactjs popper.js

我试图使用这个很棒的工具提示库Popper.js

我想使用上面的工具提示实用工具将React Components渲染到其中。现在,我的理解是,我只能使用title属性并将config对象中的html设置为true来将静态html赋予工具提示。我尝试了ReactDOMServer.renderToString,但这又创建了一个没有生命周期挂钩或任何React优势的静态标记。有什么方法可以将React组件注入工具提示中?还是可以建议其他类似的库来支持视口边界上的翻转行为?

PS:我不想使用Popper.js或react-popper,因为我希望开箱即用的触发功能。

2 个答案:

答案 0 :(得分:0)

在初始化工具提示时,您可以传递一个布尔属性,将您的标题定义为HTML

new Tooltip(reference, {html: true, title: "<div>This is a component</div>"})

See tooltip documentation

答案 1 :(得分:-1)

我最终使用了react-popper软件包。