vue2 项目markdown 如何生成导航目录

你可以使用 `markdown-it-toc-done-right` 插件生成导航目录。以下是具体步骤：

1. 安装插件

npm install markdown-it-toc-done-right --save

2. 在 `main.js` 中引入并注册插件

import Vue from 'vue'
import MarkdownIt from 'markdown-it'
import toc from 'markdown-it-toc-done-right'

const md = new MarkdownIt()
md.use(toc)

Vue.prototype.$md = md

3. 在需要生成导航目录的组件中使用 `$md.render()` 方法渲染 Markdown 文本，并在模板中使用 `v-html` 渲染

<template>
  <div>
    <!-- 此处的 markdownText 是 Markdown 文本 -->
    <div v-html="$md.render(markdownText)"></div>
  </div>
</template>

4. 在模板中使用 `tocHtml` 属性渲染生成的导航目录 HTML

<template>
  <div>
    <!-- 此处的 markdownText 是 Markdown 文本 -->
    <div v-html="$md.render(markdownText)"></div>
    <div v-html="tocHtml"></div>
  </div>
</template>

<script>
export default {
  computed: {
    tocHtml() {
      return this.$md.tocHtml()
    }
  }
}
</script>

这样就可以在 Markdown 文本中使用 `[[toc]]` 自动生成导航目录了。