I want to render a FontAwsome User Icon as done here inside a VueJS component, I have tried to replicate the same example as you can see in this codesandbox, and I have tried the two approaches as the latter mentioned in the documentation, and applied the corresponding settings:

1. el.innerHTML = "Hi <i class='fa-solid fa-user'</i>";
2. el.innerHTML = "Hi <font-awesome-icon icon='fa-solid fa-user' />";

but the FontAwsome Icon was not rendered inside a VueJs component, can you please tell me How can I solve that please? thanks in advance.

CodePudding user response：

OP ended up using the following

el.innerHTML = 'Erreur <svg viewBox="0 0 384 512"><path fill="currentColor" d="M224 402.7V32c0-17.7-14.3-32-32-32s-32 14.3-32 32v370.7l-73.4-73.3c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l128 128c12.5 12.5 32.8 12.5 45.3 0l128-128c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7z"></path></svg>';