我一直在玩Facebook的draft-js,但我实际上无法弄清楚如何获得编辑器的html输出.以下示例中的console.log输出一些_map属性,但它们似乎不包含我的实际内容?
class ContentContainer extends React.Component {
constructor(props) {
super(props);
this.state = {
value: '',
editorState: EditorState.createEmpty()
};
this.onChange = (editorState) => this.setState({editorState});
this.createContent = this.createContent.bind(this);
}
createContent() {
console.log(this.state.editorState.getCurrentContent());
}
render() {
const {editorState} = this.state;
const { content } = this.props;
return (
<Template>
<br /><br /><br />
<ContentList content={content} />
<div className="content__editor">
<Editor editorState={editorState} onChange={this.onChange} ref="content"/>
</div>
<FormButton text="Create" onClick={this.createContent.bind(this)} />
</Template>
);
}
}
Run Code Online (Sandbox Code Playgroud) 我正在尝试保存editorState到数据库并显示回编辑器。对于这件事,我遵循了这个答案
现在,当我尝试获取当前内容并使用 永久保存它时convertToRaw,它工作正常。但是当我尝试使用这些数据并将原始数据转换为contentState使用时convertFromRaw,出现以下错误:
未捕获的类型错误:contentState.getBlockMap 不是函数
editorState这是我从保存状态转换的代码:
{
const convertedState = convertFromRaw(JSON.parse(value))
const editorValue = EditorState.createWithContent(convertedState);
}
Run Code Online (Sandbox Code Playgroud)
这样,它会在编辑器中显示数据,但是当我向富编辑器中输入内容时。它提示:
未捕获的类型错误:contentState.getBlockMap 不是函数
附:使用draft-js: '0.10.5'