imzbf / md-editor-v3

Markdown editor for vue3, developed in jsx and typescript, dark theme、beautify content by prettier、render articles directly、paste or clip the picture and upload it...
https://imzbf.github.io/md-editor-v3
MIT License
1.69k stars 162 forks source link

pEle is null #692

Closed mingchiuli closed 1 month ago

mingchiuli commented 1 month ago

描述这个Bug

基础使用:

<script lang="ts" setup>
import { MdEditor} from 'md-editor-v3'
import 'md-editor-v3/lib/style.css'
import { ref } from 'vue'

const content = ref('content')

</script>

<template>
      <md-editor
        id="md-editor"
        v-model="content"
        ref="editor"
      >
      </md-editor>
</template>

<style scoped>
</style>

会控制台报错

Screenshot 2024-10-09 at 00 16 48

在这个基础上,我发现当在标签上设置:

<md-editor
    id="md-editor"
    v-model="content"
    :preview="false"
    :toolbars="toolbars"
    :toolbarsExclude="['github']"
    @on-upload-img="onUploadImg"
    :footers="footers"
    ref="editor"
  >

:preview="false"导致之后打开预览页面同步滚动也是无效的。此时设置:preview="true"也会报上面那个错

版本号

4.20.4

问题重现链接

No response

imzbf commented 1 month ago

将id修改为editorId有效

mingchiuli commented 1 month ago

将id修改为editorId有效

我试了下,在preview不为false的情况下,md-editor标签一设置id属性就会报错,这是正常的吗?

imzbf commented 1 month ago

将id修改为editorId有效

我试了下,在preview不为false的情况下,md-editor标签一设置id属性就会报错,这是正常的吗?

是的,因为内部使用editorId去管理所有的事件、通信和html节点,强行修改掉就会导致获取不到正确的节点