React-Quill - 错误你很可能想要`editor.getContents（）`

Question

当我保存表单（onSubmit）时，我得到了这个错误：你将delta对象从onChange事件传回value。你很可能想要editor.getContents()。

脚本的其余部分运行正常，并按预期将所有内容写入数据库，但React-Quill触发错误并挂起页面。

我需要做些什么来定义editor.getContents()？

export default class CreateDiscussionForm extends Component {
constructor(props){
super(props);
this.state = {
  error: '',
  editorHtml: ''
};
this.handleChange = this.handleChange.bind(this);
}

handleChange (html) {
 this.setState({ editorHtml: html });
}

onSubmit(e) {
 var background = this.state.editorHtml;
 console.log('background', background); //<p>testing</p>
 //... rest of code



<ReactQuill
    name="editor"
    theme={'snow'}
    ref="comment"
    onChange={this.handleChange}
    value={this.state.editorHtml}
    modules={quillModules}
    placeholder="add the discussion background (optional)"
/>

提前谢谢 - 鲍勃

Answer 1

不确定为什么Quill将初始值解释为delta根，但我通过传递一个如下所示的空字符串来解决此警告：

<ReactQuill
    name="editor"   
    onChange={this.handleChange}
    value={this.state.editorHtml || ''}
/>

错误链接到这里btw：https://github.com/zenoamaro/react-quill#using-deltas这是对Quill解释为增量的更高级的描述：https://quilljs.com/docs/delta/（基本上，增量是以json格式存储的更改，它们是与quill分开处理的，这意味着它是一个外部库）

Answer 2

您应该访问以下值，而不是尝试访问event.target.value：

<ReactQuill value={about} onChange={handleQuillChange} />


const handleQuillChange = value => {
    console.log(value);
};