Vue 决战默认 类

Question

我想实现以下说我 MD as

md:'#H1'

我想将其渲染为

<h1>H1</h1>

我使用 VueShowdown

实现了这一点

但我想为每个 h1 标签添加默认值 class，例如

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

我得到了类似的东西 here。

但我不知道如何在 Vue 中使用它。

在 VueShowdown 中甚至可以吗？

是否有更好的库具有此功能？

Answer 1

您可以创建一个简单的指令：

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

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

然后将该指令应用于 VueShowdown 组件：

<VueShowdown v-default-classes :markdown="markdownBinding" />