React站点警告：href属性需要有效地址。提供有效的可导航地址，因为href值jsx-a11y/anchor有效

Question

我在我建的React网站上收到了警告

./src/components/layout/Navbar.js [1]   Line 31:  The href attribute requires a valid 
address. Provide a valid, navigable address as the href value  jsx-a11y/anchor-is-valid

关于以下代码：

          <p>
            {isEmpty(profile.website) ? null : (
              <a
                className="text-white p-2"
                href={profile.website}
                target="#"
              >
                <i className="fas fa-globe fa-2x" />
              </a>
            )}
            {isEmpty(profile.social && profile.social.twitter) ? null : (
              <a
                className="text-white p-2"
                href={profile.social.twitter}
                target="#"
              >
                <i className="fab fa-twitter fa-2x" />
              </a>
            )}
            {isEmpty(profile.social && profile.social.facebook) ? null : (
              <a
                className="text-white p-2"
                href={profile.social.facebook}
                target="#"
              >
                <i className="fab fa-facebook fa-2x" />
              </a>
            )}
          </p>

即使警告只出现在第一个链接上，如果我临时删除第一个链接或将第一个链接的href更改为静态URL，下一个链接上也会出现相同的警告。

链接需要显示为只是一个图标。

我尝试过使用按钮（没有正确的外观），使用函数打开动态url，并试图通过使用"{profile.website}强制href为字符串。许多其他建议都没有奏效。

有没有一种方法可以在不改变jsx-a11y规则的情况下防止错误？我所做的不是一个好模式，还是只是React或JSX中的一个错误？

Answer 1

我已经使用了href="！#"删除警告。

Answer 2

这些措施使我摆脱了警告；

<a href="#/">...</a>  
<a href={() => false}>...</a>

Answer 3

使用href=“/#”替换href=“#”或href=“javascript:；”或href=“javascript:void（0）；”

它应该删除警告。