如何从DraftJS检索文本

Question

我正在尝试编辑文本，然后检索它并在服务器端更新数据库

这是我正在使用的代码

constructor(props,context){
    super(props,context);
    this.handleOnClick = this.handleOnClick.bind(this);

    const processedHTML = DraftPasteProcessor.processHTML(this.props.rule.description.replace(/\n/g, "<br />"));
    const contentState = ContentState.createFromBlockArray(processedHTML); 
    var editorState = EditorState.createWithContent(contentState);
    var editorState = EditorState.moveFocusToEnd(editorState);
    this.state = {editorState: editorState};
    this.onChange = (editorState) => this.setState({editorState});
}



handleOnClick(event) {
   var text = this.state.editorState.getCurrentContent().getBlocksAsArray();
   var finalText;
   text.map((item) => {
   finalText = item.getText() + finalText});
   console.log(finalText)

  render(){

    return(
    <div>
    <Col smOffset={2} mdOffset={1}>
    <PageHeader>
        {this.props.rule.title}
    </PageHeader>
    <Editor
      editorState={this.state.editorState}
      onChange={this.onChange}
    />
    </Col>

     <Col smOffset={2} mdOffset={1}>
    <Button onClick = {this.handleOnClick()}>Update rule</Button>
    </Col>
    </div>
    );

}

但是我有一个问题，draftJs返回的文本不带\ n，所以我要保存格式错误的文本，有什么办法可以使文本带有换行符吗？

Answer 1

检索文本的最佳方法是仅使用 editorState.getCurrentContent().getPlainText('\u0001')

请注意，该函数getPlainText将始终在块之间创建单个空格，因此您需要\u0001作为参数发送

Answer 2

您可以使用DraftJS的convertToRow函数类似以下内容来获取带有换行符的文本：

import {
  convertToRaw,
} from 'draft-js';
const blocks = convertToRaw(editorState.getCurrentContent()).blocks;
const value = blocks.map(block => (!block.text.trim() && '\n') || block.text).join('\n');