[英]TypeError: Cannot read property 'location' of undefined react error on using 'window'
Error when using the following code in Reactjs with MaterialUI library在带有 MaterialUI 库的 Reactjs 中使用以下代码时出错
<List>
<ListItem button onClick={()=> {window.location.href = '/project'}}>
<ListItemText primary ='Project'/>
</ListItem>
</List>
error is as following错误如下
Uncaught TypeError: Cannot read property 'location' of undefined
at onClick (Side.js:79)
at HTMLUnknownElement.callCallback (react-dom.development.js:188)
at Object.invokeGuardedCallbackDev (react-dom.development.js:237)
at invokeGuardedCallback (react-dom.development.js:292)
at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:306)
at executeDispatch (react-dom.development.js:389)
at executeDispatchesInOrder (react-dom.development.js:414)
at executeDispatchesAndRelease (react-dom.development.js:3278)
at executeDispatchesAndReleaseTopLevel (react-dom.development.js:3287)
at forEachAccumulated (react-dom.development.js:3259)
at runEventsInBatch (react-dom.development.js:3304)
at runExtractedPluginEventsInBatch (react-dom.development.js:3514)
at handleTopLevel (react-dom.development.js:3558)
at batchedEventUpdates$1 (react-dom.development.js:21871)
at batchedEventUpdates (react-dom.development.js:795)
at dispatchEventForLegacyPluginEventSystem (react-dom.development.js:3568)
at attemptToDispatchEvent (react-dom.development.js:4267)
at dispatchEvent (react-dom.development.js:4189)
at unstable_runWithPriority (scheduler.development.js:653)
at runWithPriority$1 (react-dom.development.js:11039)
at discreteUpdates$1 (react-dom.development.js:21887)
at discreteUpdates (react-dom.development.js:806)
at dispatchDiscreteEvent (react-dom.development.js:4168
I am unable to find the cause of the error and any alternate way.我无法找到错误的原因和任何替代方法。 Please suggest, Thanks
请推荐,谢谢
Not sure what the issue is if I'm being completely honest but you could try this:如果我完全诚实,不确定是什么问题,但你可以试试这个:
Outside of render function:在渲染 function 之外:
goToProject() {
window.location.href = '/project';
}
In render:在渲染中:
<List>
<ListItem button onClick={this.goToProject}>
<ListItemText primary ='Project'/>
</ListItem>
</List>
onClick={()=> {window?.location.href = '/project'}}
Change onClick function like this and try to debug and see what window object returns, also if you use server side rendering import window object through ssr-window npm package. Change onClick function like this and try to debug and see what window object returns, also if you use server side rendering import window object through ssr-window npm package.
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.