React SimpleMDE Markdown Editor
https://www.einsition.com/demos/yt-simplemde-editor
CHANGELOG.md
支持粘贴和拖拽上传图片。
支持自定义预览渲染
支持emoji表情
npm install -S yt-simplemde-editor
您可以在 demo 中查看基本用法。
git clone https://github.com/yanthink/react-simplemde-editor
cd react-simplemde-editor
npm install
npm run build
npm link
cd demo
npm install
npm link yt-simplemde-editor
npm start
参数
说明
类型
默认值
id
编辑器id
string
-
className
根元素的类名称
string
-
label
label
string
-
uploadOptions
上传附件参数
UploadOptions
-
theme
主题设置
string
-
getMdeInstance
获取编辑器实例方法
simplemde => void
-
extraKeys
快捷键设置,详见 extraKeys
object
-
value
初始化内容
string
-
onChange
内容发生改变时触发
value => void
-
options
SimpleMDE选项
object
-
emoji
emoji参数
Emoji
-
参数
说明
类型
默认值
action
上传的地址
string
无
name
发到后台的文件参数名
string
file
jsonName
后台响应的文件地址名称
string
fileUrl
allowedTypes
接受上传的文件类型
string | array
image/*
progressText
上传中显示内容
string
![Uploading file...]()
data
上传所需参数
object | file => object
-
headers
设置上传的请求头部
object
-
withCredentials
上传请求时是否携带 cookie
boolean
false
beforeUpload
上传文件之前的钩子,参数为上传的文件,若返回 false 则停止上传
(file) => boolean | Promise
-
onSuccess
上传成功事件
(response, file) => any
-
onError
上传失败事件
(err, response, file) => any
-
参数
说明
类型
默认值
enabled
是否开启
boolean
false
autoComplete
是否开启 shortname 自动补全
boolean
false
insertConvertTo
插值转换,可选值 shortname
,unicode
string
shortname
emojiToolkit
emoji-toolkit配置
object
-
categories
类别设置
{ [key: string]: { title: string; emoji: string; } }
defaultCategories
const defaultCategories: CategoriesType = {
recent: {
title: '常用',
emoji: 'clock3',
},
people: {
title: '表情符号与人物',
emoji: 'smile',
},
nature: {
title: '动物与自然',
emoji: 'hamster',
},
food: {
title: '食物与饮料',
emoji: 'pizza',
},
activity: {
title: '活动',
emoji: 'soccer',
},
travel: {
title: '旅行与地点',
emoji: 'earth_americas',
},
objects: {
title: '物体',
emoji: 'bulb',
},
symbols: {
title: '符号',
emoji: 'symbols',
},
flags: {
title: '旗帜',
emoji: 'flag_cn',
},
};