如何从多语言编辑器获取输入数据?

问题描述

我正在一个问答平台上,在该平台中,我使用mui-rte来实现该表单-就像现在输入的表单一样。我的问题是我不知道如何在不单击附带的“保存”按钮的情况下获取数据。

或者,如何在React中实现这样的rte?所需功能:数学符号,代码编辑器,纯文本

解决方法

import MUIRichTextEditor from 'mui-rte'
import { convertToRaw } from 'draft-js'

const yourComponent = () => {

const [value,setValue] = setState('')

const onChange = event => {
  const plainText = event.getCurrentContent().getPlainText() // for plain text
  const rteContent = convertToRaw(event.getCurrentContent())) // for rte content with text formating
  content && setValue(JSON.stringify(rteContent)) // store your rteContent to state
}

 return (
   <MUIRichTextEditor
     label="Your label"
     controls={['numberList',bulletList ]}
     value={value}
     onChange={onRTEChange}
   />
 )
}

controls-为所需的控件获取字符串数组 例如。 “标题” | “大胆” | “斜体” | “下划线” | “链接” | “ numberList” | “ bulletList” | “ quote” | “代码” | “清除” | “保存” | “媒体” | “删除线” | “突出显示”

在这里,我将RTE内容对象存储为字符串,但是如果您想按原样存储该对象,则由您决定。