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

相关推荐
新缸中之脑13 小时前
Chrome 146:终结专用AI浏览器?
前端·人工智能·chrome
fjh199713 小时前
通过配置 Edge 浏览器 DoH 和 ECH 实现特定网站如linuxdo裸连访问
前端·edge
北城笑笑13 小时前
Vue 99 ,Vue 项目代理配置规范:跨域解决、路径重写与多环境适配最佳实践( 企业级避坑指南 )
运维·前端·nginx·vue
梵得儿SHI13 小时前
Vue3 实战:从 0 搭建企业级后台管理系统(Router+Pinia+Axios+Element Plus 全整合)
前端·javascript·vue.js·pinia状态管理·项目初始化·页面路由配置·后台首页布局
不能只会打代码13 小时前
基于Vue 3 + Spring Boot的物联网生鲜品储运系统设计与实现(源码附有详细的文档讲解)
java·前端·vue.js·spring boot·后端·物联网·github
A923A13 小时前
【Vue3大事件 | 项目笔记】第三天
前端·vue.js·笔记·vue·前端项目
Smoothcloud润云13 小时前
告别 Selenium:Playwright 现代 Web 自动化测试从入门到实战
前端·人工智能·selenium·测试工具·架构·自动化
前端小D13 小时前
ES6 中的 Promise
前端·javascript·es6·promise
光影少年13 小时前
React和Vue的区别?
前端·vue.js·react.js
遗憾随她而去.13 小时前
前端跨页面通信:8 种方案全解析(附实战案例)
前端