0👍
If you want to render your data as HTML, you need to remove the HTML Escape Characters (<
, >
, etc.), as they will be rendered as <
and >
.
Your HTML should then be valid.
This here worked for me:
<template>
<div class="screen card">
<div>
<div v-html="text"></div>
</div>
</div>
</template>
<script>
export default {
name: "App",
data() {
return {
text: `
<pre
class="some-class" spellcheck="false">
SomeText
<div class="article__image">
<img alt="alt-text" src="null" data-src="/upload/images/11.jpg" class="img--responsive lazyload">
</div>
</pre>
<p><br></p>
`,
};
},
};
</script>
Result:
- [Vuejs]-Vue 3 – Deeply nested reactive object prop cannot be watched or computed on
- [Vuejs]-Vue router <router-link></router-link> is not working with bootstrap data-bs-toggle and data-bs-target
Source:stackexchange.com