Reactjs 输入URL并显示为指向链接的图标

我有一个表格，您可以在其中输入名称、状态、链接等，并在表格中发布。除了链接外，一切正常。下面是显示名称和链接的输入表单

<input type="text" name="name" id="name" placeholder="Name" ref={name}/>

<input type="url" name="link" id="link" placeholder="Link" ref={link}/>

---

{tracker.name}

运行良好，但

href=“{tracker.link}

您应该能够删除

“{tracker.link}”周围的引号，如下所示：

<div className="name">{tracker.name}</div>

<div className="link">
  <a href={tracker.link} target="_blank">
    <BsBoxArrowUpRight/>
  </a> 
</div>

{tracker.name}

引号将导致
{tracker.link}
被错误地视为字符串。
我想我所需要的只是更改href=“{tracker.link}”，但不知道如何更正它现在正在工作！谢谢！
<div className="name">{tracker.name}</div>

<div className="link">
  <a href={tracker.link} target="_blank">
    <BsBoxArrowUpRight/>
  </a> 
</div>