feat: 添加Markdown编辑器
This commit is contained in:
33
src/components/MarkdownEditor.vue
Normal file
33
src/components/MarkdownEditor.vue
Normal file
@@ -0,0 +1,33 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { MdEditor } from "md-editor-v3";
|
||||
import "md-editor-v3/lib/style.css";
|
||||
import { useThemeStore } from "@/stores/theme";
|
||||
|
||||
const theme = useThemeStore();
|
||||
|
||||
const text = ref("# Hello Editor");
|
||||
|
||||
async function handleSaveEvent(v: string, h: Promise<string>) {}
|
||||
|
||||
async function loadMarkdownFromString(markdown: string) {
|
||||
text.value = markdown;
|
||||
}
|
||||
|
||||
async function loadMarkdownFromUrl(url: string) {
|
||||
const response = await fetch(url);
|
||||
const markdown = await response.text();
|
||||
text.value = markdown;
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
loadMarkdownFromString,
|
||||
loadMarkdownFromUrl,
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<MdEditor v-model="text" :theme="theme.currentMode" />
|
||||
</template>
|
||||
|
||||
<style lang="postcss" scoped></style>
|
||||
Reference in New Issue
Block a user