web-editor-markdown是Web浏览器中的Markdown编辑器，用于实时渲染，如.它基于 TypeScript 和 JavaScript，不依赖于任何第三方框架。它支持中文友好，可以轻松扩展并连接到原生JavaScript，Vue，React，Angular和其他应用程序。它提供四种渲染模式：、 和 。如有必要，其底层还支持协同编辑的能力，并提供原子来扩展协作编辑。Typora SOURCE SOURCE_AND_PREVIEW RENDER PREVIEW Operation
npm install web-editor-markdown --save
<template>
<button @click="print">print</button>
{{text}}
<div id="box"></div>
</template>
<script setup lang="ts">
import { onMounted,ref } from "vue";
import { Editor, withUndoRedo } from "web-editor-markdown";
let text = ref<string>('');
let editor:Editor;
onMounted(() => {
editor = new Editor(document.querySelector("#box") as HTMLElement);
editor = withUndoRedo(editor);
editor.insertTextAtCursor('# 标题');
});
const print = ()=> {
text.value = editor.getContent();
}
</script>
<style scoped></style>