Parse String to read HTML

Asked

Viewed 77 times

0

I am developing a social network in Vue.js that needs to return in the body of one of its components a property (props).

The component is the title of a post.

<div>
        {{description}}
</div>

However, this text is stored in html and when retrieving it it returns html in text form instead of processing tags. How do I get it to process html?

javascript html5 vue.js

1 answer

2

According to the documentation:

Double keys interpret the data as plain text, not HTML. To display HTML, use the v-html directive:

That is, interpolation through {{ expressao }} always convert to text (as if you were using the property innerText of Javascript "pure").

If you want to process a string as HTML, you should use the property v-html.

Thus:

<template>
  <div v-html="valor"></div>
</template>



<script>
 export default {
      data() {
           return {
               valor: 'minha string com <b>bold</b>'
           }
     }
}
</script>

[...] Note that you cannot use the v-html directive to compose partial templates, because Vue is not a template-based engine through String. Instead, components are the indicated way as the fundamental piece of composition and reuse of interface elements.

Browser other questions tagged javascript html5 vue.js

You are not signed in. Login or sign up in order to post.