[Vuejs]-Don't know how to render html which is given as a string from get request

0👍

If you want to render your data as HTML, you need to remove the HTML Escape Characters (&lt;, &gt, 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:

The text rendered as html

Leave a comment