如何在vue3中加入markdown语法

1、首先需要安装 md-editor-v3

yarn add md-editor-v3

或者是在vue图形化界面中直接搜索 md-editor-v3 进行安装。

2、引入该编辑页

引入可以参考这个,根据自己的需求进行修改和添加。

javascript 复制代码
<template>
        <md-editor v-model="text"/>
</template>
  
<script>
import { ref } from 'vue';
import { MdEditor } from 'md-editor-v3';

export default {
    components: {
        MdEditor
    },
    setup() {
        const text = ref('# Hello Editor');
        return {
            text,
        }
    }
}
</script>

<style>
@import 'md-editor-v3/lib/style.css';
</style>

3、自定义

参考md-editor-v3,文档比较详细。可以参考一下。=

相关推荐
I love studying!!!1 分钟前
Web应用程序:用户账户
前端·数据库·sqlite
whuhewei1 分钟前
React性能优化
前端·react.js·性能优化
m0_738120722 分钟前
渗透知识ctfshow——Web应用安全与防护(三)
android·前端·安全
窝子面5 分钟前
NestJs+MongoDB+Deepseek+Langchain实现ai聊天助手
javascript·数据库·人工智能·mongodb
下北沢美食家13 分钟前
React面试题2
前端·react.js·前端框架
吴声子夜歌17 分钟前
ES6——Calss详解
javascript·es6·原型模式
摇滚侠18 分钟前
HTML CSS 演示小米 logo 的变化 border-radius 属性设置圆角
前端·css·html
❆VE❆20 分钟前
虚拟列表原理与实战运用场景详解
前端·javascript·css·vue.js·html·虚拟列表
weixin_4080996722 分钟前
【实战教程】EasyClick 调用 OCR 文字识别 API(自动识别屏幕文字 + 完整示例代码)
前端·人工智能·后端·ocr·api·安卓·easyclick
Bigger25 分钟前
第四章:我是如何扒开 Claude Code 记忆与上下文压缩机制的
前端·claude·源码阅读