Импортируйте много иконок из Font Awesome - PullRequest
Новая
       49

Импортируйте много иконок из Font Awesome

3 голосов
/ 04 мая 2019

Я импортирую много иконок FA: 

import { faUsers, faCut, faBullhorn, faPenNib, faCircle, faPalette, faVolumeUp, faSmile, faGrin, faShekelSign, faTv, faUserTie, faFolder, faPaintBrush, faCircleNotch, faSignOutAlt } 
from '@fortawesome/free-solid-svg-icons'

library.add(faUsers, faCut, faBullhorn, faPenNib, faCircle, faPalette, faVolumeUp, faSmile, faGrin, faShekelSign, faTv, faUserTie, faFolder, faPaintBrush, faCircleNotch, faSignOutAlt)

Как я могу объявить этот список один раз, а затем повторно использовать его? Будет ли это массив? Или объект ... чего?

Я думал 

const icons = {faUsers, faCut, faBullhorn, faPenNib, faCircle, faPalette, faVolumeUp, faSmile, faGrin, faShekelSign, faTv, faUserTie, faFolder, faPaintBrush, faCircleNotch, faSignOutAlt}

import icons from '@fortawesome/free-solid-svg-icons'

Но, конечно, это не работает. И что бы я сделал для library.add()?

Что это за объект, похожий на предмет, который следует за import?

Ответы [ 2 ]

1 голос
/ 04 мая 2019

Одним из решений является создание нового модуля, который экспортирует ваши конкретные значки. 

// icons.js
export {
    faUsers,
    faCut,
    faBullhorn,
    faPenNib,
    faCircle,
    faPalette,
    faVolumeUp,
    faSmile,
    faGrin,
    faShekelSign,
    faTv,
    faUserTie,
    faFolder,
    faPaintBrush,
    faCircleNotch,
    faSignOutAlt
} from '@fortawesome/free-solid-svg-icons';

Затем вы можете просто импортировать новый модуль и использовать его, используя синтаксис распространения . 

// library.js
import {library} from '@fortawesome/fontawesome-svg-core'

import * as icons from './icons';

library.add(...Object.values(icons));
1 голос
/ 04 мая 2019

import и export определены как статически анализируемые, поэтому они не могут зависеть от информации времени выполнения. Следовательно, это невозможно с оператором import.

Объект, похожий на объект после импорта, называется именованным импортом, который используется для получения выбранных элементов из списка экспортируемых элементов. Например, fontawesome имеет все объекты значков, экспортируемые через один файл. Теперь вы можете использовать импорт {...} для импорта только тех элементов, которые вам нужны.

...