Question

我正在尝试将链接添加到超棒的React组件。

<div>
    <FontAwesomeIcon icon={faHome} size="2x" />
<div>

上面的组件呈现faHome图标。

但是当我在其周围添加锚标记时，它不会呈现。我仍然可以看到，在第一个示例中没有锚标记时，带有<svg>标记的检查器工具中的组件也以相同的方式加载。

<div>
    <a href="https://www.youtube.com/c/jamesqquick">
        <FontAwesomeIcon icon={faHome} size="2x" />
    </a>
</div>

Answer 1

它运行良好。请检查以下代码：

import React from "react";
import "./styles.css";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faHome } from "@fortawesome/free-solid-svg-icons";

export default function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <div>
        <a href="https://www.youtube.com/">
          <FontAwesomeIcon icon={faHome} size="2x" />
        </a>
      </div>
    </div>
  );
}

Here is the Code Sandbox

Here is output

当我添加<a>标签时，React FontAwesome图标消失

1 个答案: