React App, Использование Font Awesome фирменных иконок в React VS Vue - PullRequest
0 голосов
/ 02 декабря 2018

Я пытаюсь использовать значки брендов из Font Awesome, я уже использовал их ранее в приложении vue, это немного отличается от использования обычных значков svg, поскольку библиотека брендов отделена от обычных значков svg.Вот как я использовал в приложении VUE.

// imports in the main.js file
import { library } from '@fortawesome/fontawesome-svg-core';
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import { faFacebookF } from '@fortawesome/free-brands-svg-icons';

library.add(faCoffee, faFacebookF);

Vue.component('fa-icon', FontAwesomeIcon)

// usage in a vue component - regular svg icons 
<fa-icon icon="coffee" />
// brand icon 
<fa-icon class="ic right" :icon="['fab', 'facebook-f']" />

Сейчас я пытаюсь сделать подобное в приложении реагирования, но я немного застрял на том, где и как его импортировать и использовать. В Vue я определил<fa-icon /> глобально в моем main.js, но с React все немного по-другому.вот моя попытка в реактивном компоненте.

// imports in my app.js file 
import React from 'react';

import { library } from '@fortawesome/fontawesome-svg-core';
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faFacebookF } from '@fortawesome/free-brands-svg-icons';

library.add(faCoffee, faFacebookF)
//this works 
<FontAwesomeIcon icon="coffee" />
//this does not
<FontAwesomeIcon icon={"['fab', 'facebook-f']"} />
спасибо заранее.

1 Ответ

0 голосов
/ 03 декабря 2018
...