Page 1 of 1
PrimeVue 3 + FontAwesome in Menus
Posted: 09 Oct 2020, 16:28
by jpavlovsky
Hi, did anyone here got FontAwesome to work in PrimeVue MenuModel?
Using the icon by itself like this works for me
Code: Select all
<font-awesome-icon icon="user-secret" />
But i can't get it to work inside an item in the MenuModel.
Re: PrimeVue 3 + FontAwesome in Menus
Posted: 10 Oct 2020, 15:52
by cagatay.civici
Should be with MenuModel only.
Code: Select all
{
label: 'Options', icon: 'fa fa-check'
}
Re: PrimeVue 3 + FontAwesome in Menus
Posted: 12 Oct 2020, 08:20
by jpavlovsky
Thank you,
for anyone else, that is just blind as me,
there is a step required to make this work:
Processing i tags into svg using Font Awesome
A basic installation of Font Awesome has the ability to automatically transform <i class="fas fa-coffee"></i> into <svg class="...">...</svg> icons. This technology works with the browser's DOM, requestAnimationFrame, and MutationObserver.
When using the @fortawesome/fontawesome-svg-core package this behavior is disabled by default. This project uses that package so you will have to explicitly enable it like this:
Code: Select all
import { dom } from '@fortawesome/fontawesome-svg-core'
dom.watch() // This will kick of the initial replacement of i to svg tags and configure a MutationObserver
Re: PrimeVue 3 + FontAwesome in Menus
Posted: 12 Oct 2020, 21:44
by cagatay.civici
Thanks for sharing.