react中quill插件的使用

##react中quill的使用
近期使用由于项目需要一款富文本编辑框，本来打算试着使用drift.js写一款富文本编辑器。但由于时间比较紧急最后选择引用第三方插件，在众多富文本插件中初步选择了Quill和CKEditor5，最后选择了简单便捷的Quill。下面是目录：

1. 引入插件
2. 配置toolbar
3. toolbar进一步自定义字体
4. toolbar自定义上传图片

引入插件：

通过npm install quill 引入最新的quill插件；

项目中引入：

import Quill from 'quill';
import 'quill/dist/quill.snow.css';

在componentDidMount进行初始化：

const textbox = this.refs.textarea;
const options = {
      debug: 'warn',
      modules: {
        toolbar: toolbarOptions,
      },
      placeholder: '请输入文本...',
      readOnly: false,
      theme: 'snow'
    };
    editor = this.editor = new Quill(textbox, options);
    const {answer} = this.props.problemDetails;
    if (answer) editor.clipboard.dangerouslyPasteHTML(answer);
      editor.on('text-change', this.handleChange.bind(this));

answer是赋予富文本的初始值；
options为配置项，debug为在console中打印信息的时期，可供选择的有‘debug’，‘warn’，‘log’和‘info’；toolbar选为TRUE是指toolbar选用默认功能；readOnly指是否可编辑；theme有‘snow’和‘bubble’两种选择，分别是toolbar部分是否显示。

配置toolbar

var toolbarOptions = [
  ['bold', 'italic', 'underline', 'strike'],        // toggled buttons
  ['blockquote', 'code-block'],

  [{ 'header': 1 }, { 'header': 2 }],