vue-markdown编辑器mavonEditor和highlight代码高亮踩坑

mavonEditor 是一款基于 vue 的 markdown 编辑器, 比较适合博客系统，使用方法简单，网上都有教程，基本没坑。
下载并且 main.js 引入 mavonEditor

npm install mavon-editor --save

// 引入
import mavonEditor from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'

// use
Vue.use(mavonEditor)

html:

<mavon-editor v-model="content" ref="md" @change="change" @imgAdd="imgAdd" style="min-height: 600px" :toolbars= 'toolbars'/>
//toolbars 省略也可以 

data:

toolbars: {
    bold: true, // 粗体
    italic: true, // 斜体
    header: true, // 标题
    underline: true, // 下划线
    strikethrough: true, // 中划线
    mark: true, // 标记
    superscript: true, // 上角标
    subscript: true, // 下角标
    quote: true, // 引用
    ol: true, // 有序列表
    ul: true, // 无序列表
    link: true, // 链接
    imagelink: true, // 图片链接
    code: true, // code
    table: true, // 表格
    fullscreen: false, // 全屏编辑
    readmodel: false, // 沉浸式阅读
    htmlcode: true, // 展示 html 源码
    help: true, // 帮助
    /* 1.3.5 */
    undo: true, // 上一步
    redo: true, // 下一步
    trash: true, // 清空
    save: false, // 保存（触发 events 中的 save 事件）/* 1.4.2 */
    navigation: true, // 导航目录
    /* 2.1.8 */
    alignleft: true, // 左对齐
    aligncenter: true, // 居中
    alignright: true, // 右对齐
    /* 2.2.1 */
    subfield: true, // 单双栏模式
    preview: false // 预览
  }            

代码高亮：
下载 highlight 并在 main.js 引入

import hljs from 'highlight.js' // 导入代码高亮文件
import 'highlight.js/styles/googlecode.css 

网上教程：（注册一个全局指令）

 Vue.directive('highlight',function (el) {let highlight = el.querySelectorAll('code,pre');
   highlight.forEach((block)=>{if(block){hljs.highlightBlock(block);
       }
   })
 })

// 使用指令
<mavon-editor v-highlight ....>

以上方法确实可行但是代码过多或者刷新后有问题（代码高亮则不生效），查看控制台发现 hljs 未定义报错

解决方案（不使用指令，判断 hljs 可用时再进行代码高亮操作）：
在获取到内容后执行以下方法：

function highlighthandle(){let highlight = document.querySelectorAll('code,pre');
    highlight.forEach((block)=>{hljs.highlightBlock(block);
    })
}
function getHljs(){
    //  判断 hljs 是否可用
    return new Promise((resolve,reject)=>{function hljsTrue(){
            try{if(hljs){clearTimeout(Timer);
                    Timer = null;
                    resolve();}
            }catch(e){Timer = setTimeout(()=>{hljsTrue();
                },100)
            }
        }
        hljsTrue();})

}
getHljs().then(()=>{highlighthandle()
})