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.