我正在使用lexical,并希望设置编辑器的初始文本。
现在,我只是尝试硬编码初始文本,结果发现我不能只传递一个String。
它需要是JSON格式。
因此,我改为传递以下内容。
'{"text":"sample text"}'
但它抛出以下错误:
TypeError:无法读取未定义的属性(读取"type")
我哪里做错了?
function Placeholder() {
return <div className="editor-placeholder">Enter some rich text...</div>;
}
const editorConfig = {
// This is how I am trying to set initial value.
// no errors if I remove this. I need this cos I need to set initial value.
editorState: '{"text":"sample text"}',
// other params
};
export default function Editor() {
return (
<LexicalComposer initialConfig={editorConfig}>
<div className="editor-container">
<ToolbarPlugin />
<div className="editor-inner">
<RichTextPlugin
contentEditable={<ContentEditable className="editor-input" />}
placeholder={<Placeholder />}
/>
{/* other login components */}
</div>
</div>
</LexicalComposer>
);
}
2条答案
按热度按时间qlckcl4x1#
我遇到了同样的问题。显然editorState可以被设置为一个函数:
我发现这个解决方案在词汇Playground来源:https://github.com/facebook/lexical/blob/main/packages/lexical-playground/src/App.tsx
下面是一个简化的示例:https://codesandbox.io/s/lexical-plain-playground-72pwge?file=/src/Editor.js:683-960
6pp0gazn2#
我在使用字符串化的词汇节点树时也遇到了这个问题。对于上下文,我的字符串化内容来自词汇Playground,具有“导出”功能。
它将所需的内容 Package 到
{editorState:{...}}
中,似乎这不是初始化LexicalComposer
的标准方式,因此在移除此 Package 器以直接获取{root:{...}}
后,它可以正常工作:)