当我使用convertFromHTML方法启动带有HTML内容的编辑器时,没有定义带有Draftjs-document的



我想用html标记初始化我的编辑器状态,但我得到了这个错误

at renderToString (/home/al/Documents/node/admin-next/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)
at render (/home/al/Documents/node/admin-next/node_modules/next-server/dist/server/render.js:86:16)
at renderPage (/home/al/Documents/node/admin-next/node_modules/next-server/dist/server/render.js:211:20)
at Function.value (/home/al/Documents/node/admin-next/.next/server/static/development/pages/_document.js:925:41)
at _callee$ (/home/al/Documents/node/admin-next/.next/server/static/development/pages/_document.js:2334:78)
at tryCatch (/home/al/Documents/node/admin-next/node_modules/regenerator-runtime/runtime.js:62:40)
at Generator.invoke [as _invoke] (/home/al/Documents/node/admin-next/node_modules/regenerator-runtime/runtime.js:296:22)
at Generator.prototype.(anonymous function) [as next] (/home/al/Documents/node/admin-next/node_modules/regenerator-runtime/runtime.js:114:21)
at asyncGeneratorStep (/home/al/Documents/node/admin-next/.next/server/static/development/pages/_document.js:352:24)

这是我从stackoverflow问题中复制的代码。当我用内容初始化editorState时,它会出错。

const blocksFromHTML = convertFromHTML(
"<p>Hey this <strong>editor</strong> rocks 😀</p>"
);
const content = ContentState.createFromBlockArray(
blocksFromHTML.contentBlocks,
blocksFromHTML.entityMap
);
const [editorState, setEditorState] = useState(
EditorState.createWithContent(content)
);

import React, { useState } from "react";
import {
Editor,
EditorState,
RichUtils,
getDefaultKeyBinding,
ContentState,
convertFromHTML
} from "draft-js";
import "./RichTextEditor.css";
import "draft-js/dist/Draft.css";
const MinimumRequirements = () => {
const blocksFromHTML = convertFromHTML(
"<p>Hey this <strong>editor</strong> rocks 😀</p>"
);
const content = ContentState.createFromBlockArray(
blocksFromHTML.contentBlocks,
blocksFromHTML.entityMap
);
const [editorState, setEditorState] = useState(
EditorState.createWithContent(content)
);
const onChangeHandler = (editorState) => setEditorState(editorState);
return (
<div className="RichEditor-root">
<Editor
blockStyleFn={getBlockStyle}
customStyleMap={styleMap}
handleKeyCommand={handleKeyCommand}
keyBindingFn={mapKeyToEditorCommand}
onChange={onChangeHandler}
placeholder="Create pc requirements..."
/>
</div>
);
};
export default MinimumRequirements;

我还是犯了这个错误。有人能帮我吗?

编辑:我的代码现在可以工作了,但我不知道为什么,而且我对这个代码没有更改?恐怕我在生产上会出错。

请参阅https://github.com/facebook/draft-js/issues/1361:

convertFromHTML不应在服务器上实现。我复制了该url中提供的信息,以解决服务器端呈现的问题

作者还包括一个涉及安装NPM包jsdom的解决方案。

最新更新