reactjs 如何使重新绘制图表自定义工具提示可点击?

lxkprmvk  于 2022-11-22  发布在  React
关注(0)|答案(2)|浏览(161)

当我试图在我的自定义工具提示中添加链接时,我无法将鼠标悬停在工具提示内容上,它将自动隐藏,是否有任何道具需要我覆盖以使其可点击?
下面是我的工具提示

<Tooltip content={(value)=>renderTooltip(value)} />

下面是我正在使用的renderTooltip

const renderTooltip = (props) => {
   if (props.active) {
     return (
       <div >
         <div className="tool-tip">

           <span className="tool-tip-footer">
             {' '}
            <a href="SOME_VALUE_FROM_PROPS">Google</a>
          </span>

      </div>

    </div>
  );
}
t9eec4r0

t9eec4r01#

我通过添加trigger='click'道具和添加样式pointer-events: auto到工具提示中我想点击的部分来实现这个功能。
recharts工具提示 Package 有pointer-events: none,即使在更改trigger后也无法单击它。

hgc7kmma

hgc7kmma2#

您是否尝试过删除if条件而只返回内容?Tooltip组件在内部计算内容是否必须显示,因此您不必这样做。

相关问题