javascript - 为什么我在antd中的Icon标签不显示

Question

这个问题困扰了我很久，在我自己的项目中，每次想用antd的Icon，都不行。不知道怎么回事，知道的请告诉我，不胜感激。

Answer 1

@Tian，我也被难住了。您的解决方案正是对我有用的。这是一些对我有用的代码：

import React from 'react';
import Icon from 'antd/lib/icon';
import 'antd/dist/antd.css';

class Header extends React.Component {
    render() {
      return (
        <div className='Header'>
          <span className='Header__title'>Happen</span>
          <a className='Icon' href='#' id='bangButton'>
            <Icon type='exclamation-circle-o'/>
          </a>
          <a className='Icon' href='#' id='plusButton'>
            <Icon type='plus-circle-o'/>
          </a>
        </div>
      );
    }
}

export default Header;

Answer 2

出现此问题是由于缺少 antd 组件所需的 css 文件

添加语句import 'antd/dist/antd.css';或创建您自己的 less 文件并导入它。

Answer 3

我发现了问题，太愚蠢了，我不导入样式，只需添加“import 'antd/dist/antd.css';”。现在可以了，希望这可以帮助像我一样刚接触antd的人。