Vue Showdown Default Classes Code Answer

Hello Developer, Hope you guys are doing great. Today at Tutorial Guruji Official website, we are sharing the answer of Vue Showdown Default Classes without wasting too much if your time.

The question is published on by Tutorial Guruji team.

I want to achieve the following say i the MD as

md:'#H1'

I want to render it as

<h1>H1</h1>

I was able to achieve this using VueShowdown

but I want add default class to every h1 tag like

<h1 class="custom">H1</h1>

I got something similar to this here.

But I don’t know how to use this in Vue.

Is it even possible in VueShowdown?

Is there any better library which has this functionality?

Answer

You can create a simple directive:

Vue.directive('default-classes', (parentElement) {
  const els = parentElement.querySelectorAll('h1')

  els.forEach((el) => {
    el.classList.add('custom')
  })
  
})

Then apply that directive to the VueShowdown component:

<VueShowdown v-default-classes :markdown="markdownBinding" />
We are here to answer your question about Vue Showdown Default Classes - If you find the proper solution, please don't forgot to share this with your team members.

Related Posts

Tutorial Guruji