A React Font Awesome component.

文件	最后提交记录	最后更新时间
examples	Use prettier-eslint to format code, upgrade node, add yarn.lock, some cleanup	9 年前
lib	Run dist script	6 年前
src	Run dist script	6 年前
test	Run dist script	6 年前
.babelrc	Filter which props are passed into the underlying span Previously the JSX splat syntax was used to pass `this.props` in its entirety into the underlying `<span>` component. This resulted in invalid HTML markup because the `name` prop was rendered in the markup, and according to the W3 HTML checker it's invalid to have a `name` prop on a `<span>` in most contexts. So instead, we split out the FontAwesome-specific props from the rest of them, and pass only the non-FontAwesome props down to the `<span>`. Test Plan: Added a regression test	10 年前
.editorconfig	Update dotfiles, add license	10 年前
.eslintignore	Update dotfiles, add license	10 年前
.eslintrc	Filter which props are passed into the underlying span Previously the JSX splat syntax was used to pass `this.props` in its entirety into the underlying `<span>` component. This resulted in invalid HTML markup because the `name` prop was rendered in the markup, and according to the W3 HTML checker it's invalid to have a `name` prop on a `<span>` in most contexts. So instead, we split out the FontAwesome-specific props from the rest of them, and pass only the non-FontAwesome props down to the `<span>`. Test Plan: Added a regression test	10 年前
.gitignore	Add lib to version control since prepublish is gone.	9 年前
.npmignore	Add examples to npmignore (#80)	7 年前
.nvmrc	Update dependencies, move to npm from yarn	6 年前
.prettierrc	Add prettier, tweak readme.	8 年前
.travis.yml	Remove support for iojs, add test for node 6, 7	9 年前
api.md	Run dist script	6 年前
changelog.md	Remove support for iojs, add test for node 6, 7	9 年前
license	Update dotfiles, add license	10 年前
package-lock.json	1.7.1	6 年前
package.json	1.7.1	6 年前
readme.md	Update maintenance status	6 年前

自动翻译

React Font Awesome

针对 Font Awesome 图标库的 React 组件。

如果您正在使用 Font Awesome v5+，请使用官方的 React 组件。react-fontawesome 不支持 Font Awesome v5！

此项目已不再积极维护。如果可能，请尝试使用上述官方组件！

安装

npm install --save react-fontawesome

注意： 此组件不包含 Font Awesome 的 CSS 或字体文件，您需要自己确保在项目中添加这些，可以通过构建过程集成或是链接至 CDN 版本。

使用 CDN 版本

最快的开始方式是通过在页面的 <head> 中添加链接标签引入 Font Awesome：

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />

您可以更改版本号以适应您所需的 Font Awesome 版本。

与 Webpack 一起使用

如果您使用的是 Webpack，需要安装 Font Awesome，导入 Font Awesome 的 Sass 或 Less 文件，并配置字体路径。关于如何使 Webpack 和 Font Awesome 协同工作，请参考这篇博客文章。

使用方法

var React = require('react')
var FA = require('react-fontawesome')

React.render(<FA name="rocket" />, document.body)

功能特点

除 React 外无其他依赖。
简化的 API，镜像 Font Awesome 类名。
支持 Font Awesome 的所有修饰符（参见下面的 API）。
支持 Css Modules 的使用。
可添加自定义 className、样式和其他属性（所有额外的 prop 直接传递给组件）。

示例

常规用法

var React = require('react')
var FontAwesome = require('react-fontawesome')

var MyComponent = React.createClass({
  render: function() {
    return (
      <FontAwesome
        className="super-crazy-colors"
        name="rocket"
        size="2x"
        spin
        style={{ textShadow: '0 1px 0 rgba(0, 0, 0, 0.1)' }}
      />
    )
  },
})

配合 CSS Modules 使用

import React from 'react'
import FontAwesome from 'react-fontawesome'
import faStyles from 'font-awesome/css/font-awesome.css'

var MyComponent = React.createClass({
  render: function() {
    return (
      <FontAwesome
        className="super-crazy-colors"
        name="rocket"
        cssModule={faStyles}
        size="2x"
        spin
        style={{ textShadow: '0 1px 0 rgba(0, 0, 0, 0.1)' }}
      />
    )
  },
})

这将会生成如下输出：

<span class="font-awesome__fa___2otTb font-awesome__fa-rocket___lfSov font-awesome__super-crazy-colors___3k583"></span>

API

详细文档请查看 API 文档。

贡献

欢迎提交拉取请求！

运行测试套件使用 npm test，并使用 npm run format 来格式化代码。确保所有测试通过，并为新功能编写测试，同时更新 JSDocs 来记录 API 的变更。

在提交您的拉取请求之前，请运行 npm run dist 来构建项目，并提交构建后的更改。

许可证

项目介绍

A React Font Awesome component.

MIT JavaScript 114提交数component components font font-awesome icon javascript props ui

定制我的领域

README

566770访问 GitHub

react-fontawesome:Font Awesome 图标库的 React 组件（支持 v4，不支持 v5）