整几个实用的富文本编辑器

331 阅读1分钟

wangEditor

image.png

English documentation

image.png

simditor

image.png

froala

简易版的 react-quill

步骤

  1. 安装富文本编辑器:npm i react-quill
  2. 导入富文本编辑器组件以及样式文件
  3. 渲染富文本编辑器组件
  4. 通过 Form 组件的 initialValues 为富文本编辑器设置初始值,否则会报错
  5. 调整富文本编辑器的样式
import ReactQuill from 'react-quill'
import 'react-quill/dist/quill.snow.css'

<Form.Item label="内容" name="content">
  <ReactQuill></ReactQuill>
</Form.Item>

image.png