fc-mdeditor

fc-mdEditor

简单的 markdown 编辑器，类似于 github 的 issues 评论模块。

• 支持简单的工具栏
• 支持粘贴上传图片
• 支持拖拽上传文件

Install

npm i fc-mdeditor

Example

import MarkdownEditor, { marked } from '../src/index';

const Demo = React.createClass({
  render() {
    return (
      <div >
        <MarkdownEditor ref="markdownEditor" />
        <div dangerouslySetInnerHTML={{
          // 渲染html字符串需要通过这样的方式（当然我们也默认支持jquery，可以用jquery的方式渲染）
          __html: marked(this.refs.markdownEditor.getValue())
        }} />
      </div>
    );
  }
});

Props

参数	说明	类型	默认值
value	初始值	String	''
placeholder	占位符	String	'Leave a comment'
uploadEnabled	是否启用上传功能	Boolean	false
uploadApi	上传接口	String	'/upload'
fileUrlPath	res 中提取 fileUrl 数据的路径	String	'url'
fileSize	上传文件大小上限(byte)	Number	10485760
fileTypes	上传文件类型限制	Array	['PNG', 'GIF', 'JPG', 'DOCX', 'PPTX', 'XLSX', 'TXT', 'PDF', 'ZIP', 'MD', 'JSON']

Methods

• getValue 获取 textarea 的 value
• setValue(val) 设置 textarea 的 value
• getMarkedValue 获取 marked 解析后的 value

Marked

MarkdownEditor.Marked
在组件静态方法上挂载了 Marked，用来解析 md 数据。
建议数据库存 md 数据，不要存解析后的 html 数据。