TypeError:element.type.toLowerCase不是函数
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了TypeError:element.type.toLowerCase不是函数相关的知识,希望对你有一定的参考价值。
我在为反应应用程序设置SSR时遇到问题。渲染的服务器端代码如下:
app.use((req, res) => {
const context = {}
const body = ReactDOMServer.renderToString(
React.createElement(
Provider, { store },
React.createElement(
StaticRouter, { location: req.url, context: context },
React.createElement(Layout, null, React.createElement(Routes))
)
)
)
if (context.url) {
res.redirect(context.url)
} else {
res.status(200).send(template({ body }))
}
})
路由配置如下:Routes.js
const Routes = () => {
return (
<Switch>
<Route path="/" exact component={Home}/>
<Route path="*" component={NotFound}/>
</Switch>
)
}
export default Routes
App.js
const App = () => {
return (
<Provider store={store}>
<BrowserRouter>
<Layout>
{router}
</Layout>
</BrowserRouter>
</Provider>
);
}
export default App
抛出以下错误:
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.
TypeError: element.type.toLowerCase is not a function
at ReactDOMServerRenderer.renderDOM (../node_modules/react-dom/cjs/react-dom-server.node.development.js:2304:28)
at ReactDOMServerRenderer.render (../node_modules/react-dom/cjs/react-dom-server.node.development.js:2298:21)
at ReactDOMServerRenderer.read (../node_modules/react-dom/cjs/react-dom-server.node.development.js:2234:19)
at Object.renderToString (../node_modules/react-dom/cjs/react-dom-server.node.development.js:2501:25)
at app.use (../server.js:59:33)
当我尝试打印console.log(React.createElement(Routes));
时,它显示如下:
{ '$$typeof': Symbol(react.element),
type: [Function: Routes],
key: null,
ref: null,
props: {},
_owner: null,
_store: {} }
我使用babel从Routes文件创建了CompiledRoutes文件,我将其导入server.js,如下所示:
const Routes = require('./client/CRoutes').default
有人可以指导我这里有什么问题吗?先谢谢。
答案
尝试改变
React.createElement(Layout, null, React.createElement(Routes))
至
React.createElement(Layout, null, React.createElement(Routes.default))
您可能在服务器端使用require
而不是import
,这会导致一些差异。
以上是关于TypeError:element.type.toLowerCase不是函数的主要内容,如果未能解决你的问题,请参考以下文章
反应本机获取多标记[未处理的承诺拒绝:TypeError:TypeError:未定义不是对象(评估'this.state.markers.map
Django TypeError - TypeError: issubclass() arg 1 必须是一个类
pyspark:TypeError:'float'对象不可迭代
Python 3.8 TypeError: can't concat str to bytes - TypeError: a bytes-like object is required, not 's