Display unescaped HTML in Vue.js
Solution 1:
You can use the directive v-html to show it. like this:
<td v-html="desc"></td>
Solution 2:
Starting with Vue2, the triple braces were deprecated, you are to use v-html
.
<div v-html="task.html_content"> </div>
It is unclear from the documentation link as to what we are supposed to place inside v-html
, your variables goes inside v-html
.
Also, v-html
works only with <div>
or <span>
but not with <template>
.
If you want to see this live in an app, click here.
Solution 3:
You can read that here
If you use
{{<br />}}
it'll be escaped. If you want raw html, you gotta use
{{{<br />}}}
EDIT (Feb 5 2017): As @hitautodestruct points out, in vue 2 you should use v-html instead of triple curly braces.