TypeError：使用“窗口”时无法读取未定义反应错误的属性“位置”

Question

在带有 MaterialUI 库的 Reactjs 中使用以下代码时出错

<List>
    <ListItem button onClick={()=> {window.location.href = '/project'}}>
      <ListItemText primary ='Project'/>
    </ListItem>
  </List>

错误如下

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

我无法找到错误的原因和任何替代方法。 请推荐，谢谢

Answer 1

如果我完全诚实，不确定是什么问题，但你可以试试这个：

在渲染 function 之外：

goToProject() {
    window.location.href = '/project';
}

在渲染中：

<List>
    <ListItem button onClick={this.goToProject}>
      <ListItemText primary ='Project'/>
    </ListItem>
  </List>

Answer 2

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.