2. 在程序中引入相关内容

import * as React from 'react'
import * as ReactDOM from 'react-dom'
import MarkdownIt from 'markdown-it'
import MdEditor from 'react-markdown-editor-lite'
import 'react-markdown-editor-lite/lib/index.css'

3. 一个简单的例子，直接拷贝可以使用

const mdParser = new MarkdownIt(/* Markdown-it options */);

// Finish!
function handleEditorChange({html, text}) {
console.log('handleEditorChange', html, text)
}
export default (props) => {
return (
<MdEditor
style={ { height: "500px" }}
renderHTML={(text) => mdParser.render(text)}
onChange={handleEditorChange}
/>
)
}

详细的配置和API可以查看官方文档： https://github.com/HarryChen0506/react-markdown-editor-lite

参考资料：

1. https://harrychen0506.github.io/react-markdown-editor-lite/

2. https://github.com/HarryChen0506/react-markdown-editor-lite

今天给大家介绍一个好用的编辑类第三方库react-markdown-editor-lite 功能强大，使用简单先来看看效果图：1. 使用npm安装包npm installreact-markdown-editor-litenpm installmarkdown-it2. 在程序中引入相关内容import * as React from 'react'import * as ReactDOM from 'react-dom'import MarkdownIt ... * @Date: 2020-08-27 16:51:19 * @LastEditTime: 2020-08-27 17:23:21 * @Email: 1755033445@qq.com * @description: 基于 react-markdown-editor-lite 的文件上传组件 import React from " react "; import { PluginComponent } from " react - markdown - import Markdown Editor from ' @uiw/ react - markdown -editor ' ; import React from ' react ' ; import React DOM from ' react -dom ' ; const Dome = () => ( < Markdown Editor value = { this . state . markdown 笔者在18年年末的时候接到一个开发任务——搭建一个AI项目的开放平台，其中的产品文档为转化为HTML格式的 markdown 文档。考虑到文档的即时更新，将文档信息做成了Ajax接口的形式。因此管理后台只需将textarea表单的内容通过 markdown 解析器进行HTML格式转化，然后将 markdown 内容和经转化的HTML文档都保存到数据 库 即可。 基本需求完成后，为了更好的用户体验，考虑将常用...