react集成tinymce富文本编辑器

tinymce富文本编辑器

官方文档：https://www.tiny.cloud/docs/quick-start/
中文文档：http://tinymce.ax-z.cn/
支持vue、react、angular

react集成

命令

yarn add @tinymce/tinymce-react
yarn add tinymce

代码

import {
    useState, useEffect } from 'react'
import {
    Editor } from '@tinymce/tinymce-react'
import 'tinymce/tinymce'
import 'tinymce/models/dom'
import 'tinymce/icons/default'
import 'tinymce/themes/silver/theme'
// Skins
import './index.less'
// Plugins 组件根据init中调用情况自行加载
import 'tinymce/plugins/accordion'
import 'tinymce/plugins/charmap'
import 'tinymce/plugins/help'
import 'tinymce/plugins/media'
import 'tinymce/plugins/searchreplace'
import 'tinymce/plugins/advlist'
import 'tinymce/plugins/code'
import 'tinymce/plugins/image'
import 'tinymce/plugins/nonbreaking'
import 'tinymce/plugins/table'
import 'tinymce/plugins/anchor'
import 'tinymce/plugins/codesample'
import 'tinymce/plugins/importcss'
import 'tinymce/plugins/pagebreak'
import 'tinymce/plugins/template'
import 'tinymce/plugins/autolink'
import 'tinymce/plugins/directionality'
import 'tinymce/plugins/insertdatetime'
import 'tinymce/plugins/preview'
import 'tinymce/plugins/visualblocks'
import 'tinymce/plugins/autoresize'
import 'tinymce/plugins/emoticons'
import 'tinymce/plugins/link'
import 'tinymce/plugins/quickbars'
import 'tinymce/plugins/visualchars'
import 'tinymce/plugins/autosave'
import 'tinymce/plugins/fullscreen'
import 'tinymce/plugins/lists'
import 'tinymce/plugins/save'
import 'tinymce/plugins/wordcount'
import './langs/zh-Hans'
export default function RichEditor({
     value, onChange }