1.MD格式文件
我们经常会遇到md格式文件的编辑和预览,推荐两个插件:
@uiw/react-markdown-editor,@uiw/react-markdown-preview,不通语言应该有对应的版本,这里是react为例子,也是用过其他的组件,但都多少会有些问题,例如marked组件,下面直接使用吧:
1)@uiw/react-markdown-editor
这个组件是一个富文本组件,类似于我们在编辑csdn文章:
<MarkdownEditor
value={`### test`}
onChange={() => {}}
visible={true}
/>
这里面还有一些其他属性,请参考:
react-markdown-editor: 基于React的Markdown 编辑器组件。https://gitee.com/uiw/react-markdown-editor/#https://gitee.com/link?target=https%3A%2F%2Fgithub.com%2Fuiwjs%2Freact-markdown-preview%2Ftree%2Fv2.1.0%23options-props
2) @uiw/react-markdown-preview
这个组件仅提供只读,不支持编辑,根据使用场景选择就好:
<MarkdownPreview source={other_data?.release_note} />
GitHub - uiwjs/react-markdown-preview at v2.1.0React component preview markdown text in web browser. The minimal amount of CSS to replicate the GitHub Markdown style. Support dark-mode/night mode. - GitHub - uiwjs/react-markdown-preview at v2.1.0https://github.com/uiwjs/react-markdown-preview/tree/v2.1.0#options-props