如何在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,文档比较详细。可以参考一下。=

相关推荐
涛涛ing几秒前
WebMCP正式进入Origin Trial:AI Agent不再“装人”,前端交互范式正在被重写
前端
y = xⁿ6 分钟前
关于Agent智能体开发
开发语言·前端·javascript
梅孔立9 分钟前
Codex 完整教程(Node.js安装 + npm安装Codex + DeepSeek配置 + 快捷键 + 设置)
前端·npm·node.js
事圆则缓16 分钟前
Flutter 状态管理框架对比(一):先看地图,再选工具
前端·javascript·flutter
中杯可乐多加冰19 分钟前
解决方案:CEB 文件 Web 端在线预览方案,Linux部署ceb文件在线预览工具
linux·运维·前端·ceb
晚风醉蝶25 分钟前
webpack 模块提取
前端·webpack·node.js·ast·逆向分析
IMPYLH29 分钟前
HTML 的 <tfoot> 元素
前端·javascript·html
像风一样自由202034 分钟前
42.VueReactNextjs如何为AI应用设计前端交互
前端·人工智能·大模型·交互·rag·智能体
鬼手点金34 分钟前
Claude Code示范案例-修复 Bug 工作流
java·服务器·前端·javascript·bug·openclaw
柳杉44 分钟前
用 GPT-6 Astra 和 Tripo3D 做智慧农业 3D 大屏:从调研到可巡检园区全流程实录
前端·ai编程·数据可视化