React 富文本编辑器(react-draft-wysiwyg)

本文详细介绍了如何利用React组件库React-draft-wysiwyg创建一个功能丰富的所见即所得(WYSIWYG)文本编辑器。内容涵盖了安装步骤、基本用法、自定义样式以及与后端数据的交互,帮助开发者实现高效、易用的文本编辑功能。
摘要由CSDN通过智能技术生成
这里是依赖:需要npm install 进来的
"dependencies": {
    "babel-polyfill": "^6.26.0",
    "draft-js": "^0.11.2",
    "draftjs-to-html": "^0.8.4",
    "html-to-draftjs": "^1.4.0",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-draft-wysiwyg": "^1.13.2",
    "react-scripts": "3.2.0"
  }
import React from 'react';
import { EditorState, convertToRaw, ContentState } from 'draft-js';
import { Editor } from 'react-draft-wysiwyg';
import draftToHtml from 'draftjs-to-html';
import htmlToDraft from 'html-to-draftjs';
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';     

class App extends React.Component {
   constructor(props) {
    super(props);
    this.state = {
      editorState: EditorState.createEmpty(),
      editorCont
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值