vue使用marked.js实现markdown转html并提取标题生成目录

html：

<template>
    <div class="wrapper">
        <div class="container">
            <div class="menu">
                <ul class="menu-list">
                    <li v-for="(nav, index) in navList" 
　　　　　　　　　　　　　　:key="index" 
　　　　　　　　　　　　　　:class="{on: activeIndex === index}" 
　　　　　　　　　　　　　　@click="currentClick(index)">
                        <a href="javascript:;" @click="pageJump(nav.index)">{{nav.title}}a>
                        <div v-if="nav.children.length > 0 && activeIndex === index" 
　　　　　　　　　　　　　　　　class="menu-children-list">
                            <ul class="nav-list">
                                <li v-for="(item, idx) in nav.children" 
　　　　　　　　　　　　　　　　　　　　　:key="idx" 
　　　　　　　　　　　　　　　　　　　　　:class="{on: childrenActiveIndex === idx}" 
　　　　　　　　　　　　　　　　　　　　　@click.stop="childrenCurrentClick(idx)">
                                    <a href="javascript:;" @click="pageJump(item.index)">
　　　　　　　　　　　　　　　　　　　　　　　　{{item.title}}
　　　　　　　　　　　　　　　　　　　　　 a>
                                li>
                            ul>
                        div>
                    li>
                ul>
            div>
            <div class="help-center-content" v-html="compiledMarkdown"
 　　　　　　　ref="helpDocs" @scroll="docsScroll">div>
        div>   
    div>
template>

js部分：

 

参考链接： 

https://github.com/markedjs/marked

https://www.jianshu.com/p/d182ea991609

https://hk.saowen.com/a/bf975e4296e33a14e2d0ad50aa7cbf24fbfb4a9fb851de171b4c71da54eb95e5

转载于:https://www.cnblogs.com/yhquan/p/10276811.html