2

我正在构建一个具有该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文件时,一切正常。

谁能帮我解决这个问题?

4

0 回答 0