一、安装
安装react-markdown-editor-lite:
npm i react-markdown-editor-lite
安装markdown-it
npm i markdown-it
二、输入
const mdEditor = useRef(null);
const mdParser = new MarkdownIt(/* Markdown-it options */);
const onPaste = event => {
const { items } = event.clipboardData;
if (items && items[0].type.indexOf('image') > -1) {
const file = items[0].getAsFile();
const data = new FormData();
data.append('file', file);
post('', data).then(res => {
if (res.code === 0) {
mdEditor.current.insertText(
``
);
}
});
}
};
......
<MdEditor
ref={mdEditor}
value={value}
renderHTML={text => mdParser.render(text)}
onChange={({ html, text}) => onChange(text)}
/>
三、显示
const md = require('markdown-it')();
.....
<div dangerouslySetInnerHTML={{ __html: md.render(value) }}></div>