FortAwesome / vue-fontawesome

Font Awesome Vue component
https://fontawesome.com
MIT License
2.39k stars 132 forks source link

Error event when icon cannot be resolved #385

Open manniL opened 2 years ago

manniL commented 2 years ago

Is your feature request related to a problem? Please describe. Hey! 👋 Right now it is difficult to handle edge cases when icons cannot be resolved (think of e.g. user input) and to show a default icon in this case.

Describe the solution you'd like It would be helpful if the component could emit an error event that parent components can listen to and act accordingly instead of just logging the error.

Describe alternatives you've considered Right now, only checking the DOM manually, which is tedious 😂

chemtrails commented 7 months ago

+1 AFAIK right now you have to check your input like

<template>
    <font-awesome-icon v-if="icons.includes(userInput)" :icon="['fab', userInput]"></font-awesome-icon>
</template>

<script setup>
    import { fab } from '@fortawesome/free-brands-svg-icons'
    const icons = Object.values(fab).map(v => v.iconName)
    const userInput = ref('twitter')
</script>