SaiAdmin

markdown编辑器 - 使用文档

安装

将sa-md-editor和sa-md-preview直接拷贝到saiadmin-vue的src/components目录中 如果需要全局使用，则在src/components/index.js文件中进行全局注册

如何使用

编辑组件sa-md-editor

<template>
  <a-form ref="formRef" :model="formData" :rules="rules" :auto-label-width="true">
    <a-form-item label="公告内容" field="content">
      <sa-md-editor v-model="formData.content" />     
    </a-form-item> 
  </a-form>
</template>

预览组件sa-md-preiview 由于md-editor-3组件的链接不是通过新窗口打开，需要安装一个包实现新窗口打开链接，执行命令如下

yarn add markdown-it-link-attributes

使用方式如下

<template>
  <a-drawer v-model:visible="visible" :title="title" :footer="false" width="80%">
    <sa-md-preview :text="text" />
  </a-drawer>
</template>

版本支持

兼容 saiadmin3.x

兼容 saiadmin5.x