- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我已使用convertToRaw 将内容保存到数据库中,我正尝试将其加载回draft.js 编辑器以使用户能够重新编辑内容。
draft.js 编辑器包含在 react-modal 中当用户单击内容上的“编辑”时显示的基于组件。这很重要,因为模态框(和编辑器)不会重新实例化,它们只是显示和隐藏。
编辑器在 (ES6) 类构造函数中启动一次,只需使用:
this.state = {editorState: EditorState.createEmpty()}
当用户单击“编辑”时,我从数据库加载原始内容,然后我尝试使用以下多种变体将原始内容加载到编辑器中:
const contentState = convertFromRaw(rawContent)
const newEditorState = EditorState.push(this.state.editorState, contentState);
this.setState({editorState: newEditorState})
虽然 newEditorState 显然包含正确的内容,但 this.setState({editorState: newEditorState})
似乎对组件(或编辑器)的状态没有任何影响。
我该如何为编辑器设置新状态?谢谢!
更新经过进一步调查,显然只是 this.setState({editorState: newEditorState})
只是编辑器组件失败了。
我通过设置测试状态属性并成功更新它来测试它,而 editorState 保持不变。
为了充分测试这一点,在我的构造函数中,我使用测试值初始化了状态:
this.state = {
editorState:EditorState.createWithContent(ContentState.createFromText('Hello')),
testVal: 'Test Val 1'
}
然后我编写了一些测试代码来展示 setState 如何适用于我的测试值,但不适用于 Draft.js editorState:
const newEditorState = EditorState.createWithContent(ContentState.createFromText('Goodbye'))
console.log('Before setState')
console.log('newEditorState: ' + newEditorState.getCurrentContent().getPlainText());
console.log('editorState: ' + this.state.editorState.getCurrentContent().getPlainText());
console.log('testVal: ' + this.state.testVal);
this.setState({editorState: newEditorState, testVal: 'Test Val 2'}, function(){
console.log('After setState')
console.log('editorState: ' + this.state.editorState.getCurrentContent().getPlainText());
console.log('testVal: ' + this.state.testVal);
});
控制台输出如下所示:
Before setState
newEditorState: Goodbye
editorState: Hello
testVal: Test Val 1
After setState
editorState: Hello
testVal: Test Val 2
我不明白为什么在 testVal 更新时,draft.js editorState 没有更新?
最佳答案
我在我的项目中使用了以下内容
const blocks = convertFromRaw(props.rawBlocks);
editorState = EditorState.createWithContent(blocks, null);
关于javascript - 无法在 Draft.js 中设置 editorState (它看起来不可变,但没有错误),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38710215/
我开始使用 Draft-js 中的装饰器,并且能够渲染 CompositeDecorator 中定义的组件。记录下来的行为效果很好。 也就是说,我正在尝试弄清楚如何从这些组件中访问 editorSta
我正在使用 draftjs 创建富文本编辑器.这是最小的codesandbox所以你知道问题是什么。 所以我有一个辅助函数 getCurrentTextSelection将我选择的文本返回给我: co
有一些纯文本内容需要插入到存在的textEditor中,我尝试使用EditorState.push方法,我认为它适用于这种情况。我尝试这样的事情: const { ContentState: { cr
我正在尝试使用 react-draft-wysiwyg 编辑器完成一些操作后重置编辑器内容。使用 draftjs-utils 中的 clearEditorContent 方法清除所有内容。但是清除内容
因此,我使用 Draft-js 来创建博客文章。当用户创建帖子时,数据被转换为字符串并发送到服务器以进行保存。我像这样转换了 draft-js EditorState:JSON.stringify(c
我正在使用 Draft-js with Formik与 是的 用于验证 Draft EditorState 组件。 我假设我可以通过使用以下 yup 测试来检查 EditorState 是否为空: /
我已使用convertToRaw 将内容保存到数据库中,我正尝试将其加载回draft.js 编辑器以使用户能够重新编辑内容。 draft.js 编辑器包含在 react-modal 中当用户单击内容上
我试图让一个函数仅在 contentState 本身发生变化时运行,而不仅仅是 editorState。 我现在的想法是将旧的 contentState 存储为字符串并将其与新的 contentSta
我是一名优秀的程序员,十分优秀!