我正在构建一个具有该SSR
功能的反应应用程序,我正在使用React.Suspense
客户端进行代码拆分,我收到了这个警告。
Warning: Did not expect server HTML to contain a <div> in <div>
App.js
我在客户端有我的文件: -
import React,{Suspense,lazy} from "react"
import { Route, Switch } from 'react-router-dom'
const Home = lazy(() =>
import('./components/Home')
)
const Post = lazy(() =>
import('./components/Post')
)
function App(){
return(
<div>
<Suspense fallback={<div>wait...</div>}>
<Switch>
<Route path="/" component={Home}/>
<Route path="post" component={Post}/>
</Switch>
</Suspense>
</div>
)
}
我也有App.js
服务器端的文件,但我没有React.Suspense
在那里使用,因为服务器不支持它。该文件如下所示:
import React from "react"
import { Route, Switch } from 'react-router-dom'
import routes from './routes'
function App(){
return(
<div>
<Switch>
{routes.map(({ path, exact, component: Component, ...rest }) => (
<Route key={path} path={path} exact={exact} render={(props) => (
<Component {...props} {...rest} />
)} />
))}
</Switch>
</div>
)
}
我的应用程序在服务器上完美呈现,但在客户端,我得到了Warning
,当我删除Suspense
客户端App.js
文件时,一切正常。
谁能帮我解决这个问题?