react项目中集成 braft-editor富文本编辑

1.首先安装编辑器

cnpm i braft-editor --save

2.富文本相关全部代码

import React from 'react'
import {
    Form, Select, InputNumber, Switch, Radio,
    Slider, Button, Upload, Icon, Rate, Checkbox,
    Row, Col, Input, DatePicker, Modal, Card, Spin, message
} from 'antd';
import './yunyingissue.scss'
import { postfn, getfn, Normal } from '../../../../server'
import moment from 'moment';
import axios from 'axios'
import Regex from 'regex'
// 富文本
import BraftEditor, { EditorState } from 'braft-editor';
// 引入编辑器样式
import 'braft-editor/dist/index.css';
// 引入七牛
import * as qiniu from 'qiniu-js';
// 日期选择设置为中文
import { LocaleProvider } from 'antd';
import zh_CN from 'antd/lib/locale-provider/zh_CN';
import 'moment/locale/zh-cn';
const { Option } = Select;
const { MonthPicker, RangePicker } = DatePicker;





class Demo extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            // 富文本
            // 创建一个空的editorState作为初始值
            editorState: EditorState.createFrom(''),
            htmlDom: "",
            token: "",
            urlKey: '',//七牛返回来的key
            qiniuBaseUrl: '',//区别正式和测试环境
        }
        // 富文本相关
        this.upImgs = this.upImgs.bind(this);
    }
   
    // 富文本
    submitContent = async () => {
        // 在编辑器获得焦点时按下ctrl+s会执行