使用标题在仅预览模式下会跳转,希望不要跳转

tech-xs commented 2 years ago

使用标题在仅预览模式下会跳转,希望不要跳转使用 @markedHeading 发现没有走这个函数不清楚应该怎么处理

使用属性 previewOnly

<template>
  <Mgr>
    <md-editor class="body" v-model="mdText"
               @markedHeading="markedHeading"
               previewOnly/>
  </Mgr>
</template>

<script>
import Mgr from '@/components/mgr/Mgr'
import MdEditor from 'md-editor-v3';
import 'md-editor-v3/lib/style.css';
import {getDocContent} from "@/api/doc/doc";

export default {
  name: "WebDoc",
  components: {Mgr, MdEditor},
  data() {
    return {
      mdText: ''
    }
  },
  created() {
    getDocContent('/web/webDoc').then(res => {
      this.mdText = res
    })
  },
  methods:{
    markedHeading(text, level, raw){
      console.log('aaaaa')
      console.log(text)
      console.log(level)
      console.log(raw)
    }
  }
}
</script>
<style lang="less" scoped>
.body {
  margin-left: 50px;
  margin-right: 50px;
}
</style>

imzbf commented 2 years ago

抱歉，文档有点问题，请像下面这样使用：

<md-editor class="body" v-model="mdText" :markedHeading="markedHeading" preview-only />

会跳转是因为有a标签，像下面这样做就可以了

  methods: {
    markedHeading(text, level, raw) {
      return `<h${level} id="${raw}">${text}</h${level}>`;
    }
  }

tech-xs commented 2 years ago

好的多谢美滋滋

imzbf / md-editor-v3

使用标题在仅预览模式下会跳转,希望不要跳转 #50