0
127
ViewsHow to convert data from HTML editor to HTML on the page?
I have project which is build from main page and admin panel. On my admin panel I have Vue2Editor - HTML editor. So, when I write something, it goes to DB and then that data is shown on main page, but there is a problem.
The example of data looks like that:
{
"id": "04c47128-de82-459c-acb5-c8d99c61bbe6",
"content_tip": "<h3>Some random text</h3>",
"created_at": "2021-10-17T11:53:03.000Z",
"updated_at": "2021-10-17T11:53:03.000Z"
},
As you can see content_tip field value looks like simple HTML, but on page I see as simple text, so, how can I convert that <h3>Some random text</h3> into real HTML on page.
·
Juan Pablo Isaza
1 answers
Answer question0
You need to use v-html directive :
new Vue({
el: '#demo',
data() {
return {
item: {
"id": "04c47128-de82-459c-acb5-c8d99c61bbe6",
"content_tip": "<h3>Some random text</h3>",
"created_at": "2021-10-17T11:53:03.000Z",
"updated_at": "2021-10-17T11:53:03.000Z"
},
}
}
})
Vue.config.productionTip = false
Vue.config.devtools = false<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<div v-html="item.content_tip"></div>
</div>
·
Juan Pablo Isaza
Report
Answer question