Draftjs 如何启动带有内容的编辑器 [英] draftjs how to initiate an editor with content

问题描述

偶然发现了 Facebook 开发的这款很酷的文本编辑器 draft.js.我试图遵循 Github 中的示例，但我想创建一个带有内容的编辑器，而不是一个空的编辑器.

Stumbled on this cool text editor, draft.js by Facebook. I tried to follow the example in Github, but I want to create an editor with content instead of an empty editor.

var EditorState = Draft.EditorState;

var RichEditor = React.createClass({
   getInitialState(){
      return {editorState: EditorState.createWithContent("Hello")}
      //the example use this code to createEmpty editor
     // return ({editorState: EditorState.createEmpty()})
   }
});

当我运行它时，它抛出一个错误并显示以下消息Uncaught TypeError: contentState.getBlockMap is not a function".

When I run it, it throws an error with the following message "Uncaught TypeError: contentState.getBlockMap is not a function".

推荐答案

EditorState.createWithContent 是一个 ContentState，而不是一个字符串.您需要导入 ContentState

The first argument to EditorState.createWithContent is a ContentState, not a string. You need to import ContentState

var EditorState = Draft.EditorState;
var ContentState = Draft.ContentState;

使用 ContentState.createFromText 并将结果传递给EditorState.createWithContent.

Use ContentState.createFromText And pass the result to EditorState.createWithContent.

return {
  editorState: EditorState.createWithContent(ContentState.createFromText('Hello'))
};

这篇关于Draftjs 如何启动带有内容的编辑器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！