[Vuejs]-Text only showing up in td element and not HTML

1👍

Try this:

<td v-html="ReplaceDashesInGlobalGroups(global.globalGroupName)"></td>

This should be rendered as HTML now instead of just plain text. Note this can open you up to XSS attacks.

Source: Documentation

Updates the element’s innerHTML. Note that the contents are inserted
as plain HTML – they will not be compiled as Vue templates.
If you
find yourself trying to compose templates using v-html, try to rethink
the solution by using components instead.

Dynamically rendering arbitrary HTML on your website can be very
dangerous because it can easily lead to XSS attacks. Only use v-html
on trusted content and never on user-provided content.

In single-file components, scoped styles will not apply to content
inside v-html, because that HTML is not processed by Vue’s template
compiler. If you want to target v-html content with scoped CSS, you
can instead use CSS modules or an additional, global <style> element
with a manual scoping strategy such as BEM.

Leave a comment