react快照的Firebase问题

Question

我试图从主页上的firebase加载项目，但它一直给我一个错误。有人有什么建议吗？

我正在遵循上的指南https://github.com/stereobooster/react-snap

并像这样实现：

import React from 'react';
import {hydrate, render } from 'react-dom';
import './index.css';
import App from './components/App';
import * as serviceWorker from './serviceWorker';
import FirebaseProvider from './utils/firebase'
const rootElement = document.getElementById("root");
if (rootElement?.hasChildNodes()) {
hydrate( <FirebaseProvider><App /> </FirebaseProvider> , rootElement);
} else {
render(<FirebaseProvider><App /> </FirebaseProvider> , rootElement);
}

这就是错误：

TypeScript error in /Users/bigbot/Desktop/buyid/src/index.tsx(11,12):
This JSX tag's 'children' prop expects a single child of type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>', but multiple children were provided.  TS2746
9 | const rootElement = document.getElementById("root");
10 | if (rootElement?.hasChildNodes()) {
> 11 |   hydrate(<FirebaseProvider> <App /> </FirebaseProvider>, rootElement);
|            ^
12 | } else {
13 |   render(<FirebaseProvider><App /></FirebaseProvider>, rootElement);
14 | }

Answer 1

还有额外的？在您的代码中。我建议你试着改变

if (rootElement?.hasChildNodes()) {
hydrate( <FirebaseProvider><App /> </FirebaseProvider> , rootElement);
} else {
render(<FirebaseProvider><App /> </FirebaseProvider> , rootElement);
}

至

if (rootElement.hasChildNodes()) {
hydrate(<App />, rootElement);
} else {
render(<App />, rootElement);
}