CODEWITHSUNDEEP
javascriptvue.jshighlightjs
Flutterby_Dev
Flutterby_Dev

Reputation: 194

How do I get Highlight.js to show HTML in a Vue component?

I'm using highlight JS with a Vue project and I want to show a div on the edges of my code. I've tried 

<pre v-highlightjs="viewerHTML"><div>Something here</div><code class="html">

and 

<pre v-highlightjs="viewerHTML">'<div>Something here</div>'<code class="html">

Both are hiding the div portion. How do I show the full code?

Upvotes: 1

Views: 1164

Answers (1)

Flutterby_Dev
Flutterby_Dev

Reputation: 194

I found that if I created a string in in my data section of my Vue component it renders correctly

<pre v-highlightjs="viewerHTML"><code class="html">



data () {
  return {
    viewerHTML: '<div>Something here</div>'
  }

Upvotes: 2

Related Questions