我想将 React 组件的状态保存在数据库中。
Json.stringify(myComponent);
但是，当我尝试通过 JSON.parse 再次使用该组件时，我得到
Error: Objects are not valid as a React child (found: object with keys {type, key, ref, props, _owner, _store})
它是一个 JSON 数组。我读到这是由 JSX 键引起的。
是否有任何包允许我将 JSX 保存为字符串或对象，然后将其再次渲染为 React 组件？
我正在玩这样的事情，我想在数据库中存储react组件的表示并将其呈现回来。经过一番研究，我找到了一种将组件存储为 JSON blob 并将其呈现回 UI 的方法。
查出来。https://gist.github.com/praveensastry/132eacff4a684a48e73cae21f2451078
这是一个古老的问题，但由于我是在自己的搜索中偶然发现的，因此其他人可能也是这样。
如果您想将 JSX 存储在 JSON 中而不将其转换为静态标记或字符串或使用其他外部库，您可以使用普通的 react/react api 来实现。
在我的用例中，我既需要创建新对象，也需要从存储/数据库中检索现有对象，因此我正在循环访问一个对象，并且该对象的键之一是组件/JSX。
例子：
const experiment = <img src={sampleImagePath}></img>;
const example = { object: experiment }
然后，在代码的某个地方，我们有一个函数，它返回我们在对象中拥有的任何 JSX。就我而言，循环遍历一个对象并返回存储在 JSON 中的元素。
return (
<div>
{React.createElement(object.type, object.props)}
</div>);
关键部分是React.createElement，如果您需要，您可以在文档中阅读更多信息：https : //reactjs.org/docs/react-api.html#createelement
它可能不会涵盖所有用例，但它可能是一个很好的起点。我知道将这个作为答案可以节省我几分钟搜索 SO 和 react 文档的时间。
感谢您的回复。
我已经通过将其转换为 html 字符串然后使用 package.json 将它们转换回来解决了这个问题html-to-react。
ReactDOMServer.renderToStaticMarkup(entry);
//save to database as a html string.
然后使用它来转换 html 字符串以进行react。 https://github.com/mikenikles/html-to-react
在我的场景中，我去了
因为它更直接：
import React from 'react';
import ReactHtmlParser, { processNodes, convertNodeToElement, htmlparser2 } from 'react-html-parser';
class HtmlComponent extends React.Component {
render() {
const html = '<div>Example HTML string</div>';
return <div>{ ReactHtmlParser(html) }</div>;
}
}