如何防止位置對象在重新加載 reactjs 時重置

Question

我正在使用 Link 來重新直接調用另一個組件。 像這樣的東西

<Link to={{ pathname: "/app/" + app.appId, appDetail: { app: app } }}>>

在調用路徑 /app/:appId 它調用 AppDetails 組件。 我在 location 對象中獲取 appDetail 對象。

但是在重新加載路線 /app/:appId 時，位置對象中的這個 appDetail 變得未定義。 那么如何防止這種情況發生，以便在重新加載 /app/:appId 時，來自 location 對象的 appDetail 不應未定義

Answer 1

有很多方法可以控制這種行為，這里是一種：嘗試將位置對象放在 if 條件中，例如：

if(!location) {
  return <>Loading...</>
}

上述條件將保持執行，直到條件滿足

Answer 2

有state屬性可以將數據傳遞給其他組件。 所以你可以做這樣的事情：

<Link to={{
  pathname: "/app/" + app.appId,
  state: { appDetail: { app: app }}
}}>

並在其他組件中獲取appDetail ：

const { appDetail } = this.props.location.state;