0

在我的 React 应用程序中,我想ReactTooltip在我的组件周围使用 a,这样工具提示的内容是一些带有指向另一个网站的链接的文本。我的组件有return这样的:

  return (
    <>
      <div className="col-xs-6 col-sm-4" >
        <Link to={earnnestLink(deal)} target="_blank" data-tip={'abc<br /> def </br> ghi <a href="www.google.ca"/>'} >
            Request Escrow Funds
          </Link>
      </div>
      <ReactTooltip
        multiline
        html
        id="earnnest-link-tooltip"
        place="bottom"
        border
        effect="solid"
        type="light"
        className="custom-tooltip-large" />
    </>
  )

ReactTooltip的来自import ReactTooltip from 'react-tooltip'

但后来我的用户界面看起来像这样

所以我有两个问题:

  1. 如何正确显示www.google.ca的链接?请注意,HTML<br />已呈现,但链接的 HTML 未呈现。
  2. 当我将光标从“请求托管资金”文本移到工具提示中并打算单击嵌入式链接时,工具提示就会消失。我认为这是因为我的光标在<Link>组件之外。当我将光标移动到工具提示中时,如何让它保持在那里?

谢谢!

4

0 回答 0