Reactjs 使用localstorage在页面加载时响应重定向

我一直在四处搜索，虽然我已经找到了其他类型重定向的不同方法，但我还没有找到一种可以帮助我解决这个问题的方法

我的想法是，我需要在localstorage上保存一个sessionID变量，我将使用它来确定用户是否已登录到应用程序，以便我可以将他/她重定向到相应的页面。但是我没能做到。以下是我目前的代码：

import React, { Component } from 'react';
import './App.css';
import Header from './components/Header/Header';
import Footer from './components/Footer/Footer';
import Home from './components/Home/Home';
import VideoGrid from './components/VideoGrid/VideoGrid'
import { Route, Redirect } from 'react-router-dom';


class App extends Component {

  constructor(props){
    super(props);
    this.state = {sessionID: "-2", sendToGrid: false};
  }

  componentDidMount() {
    if(this.state.sessionID === "-1"){
        console.log("session is not started");
        console.log(this.state.sendToGrid);
    } else {
      console.log("session has started");
      this.setState( { sendToGrid: true });
      console.log(this.state.sendToGrid);
    }
  }

  render() {

    const { redirect } = this.state;

    console.log("must be sent to grid: " + redirect.sendToGrid);

    var landingPage;

    if(redirect.sendToGrid){
      landingPage = <Home />
    } else {
      landingPage = <VideoGrid />
    }

    return (
      <div className="App">
        <Header />

          <Route exact={true} path="/" component={Home} />
          <Route path="/videogrid" component={VideoGrid} />

          {landingPage}

        <Footer />
      </div>
    );
  }
}

export default App;

我得到了以下错误：

编辑2：

未保存所需的组件，因此编辑时会显示错误

---

@palsrealm提供的答案解决了我的问题。

要像

const {redirect} = this.state;

在

状态

对象中需要有一个

重定向

键。事实并非如此。还是你只是想写信

const redirect = this.state;

---

您可以使用

Route

的

render

方法根据您的逻辑显示组件。差不多

<Route exact={true} path="/" 
       render={(props)=>{
            if(this.state.sessionID ==="-1" ) return <Home/>;
            else return <VideoGrid/>;
}} />

是指您尚未在构造函数中的

状态

对象中定义

重定向

要

localstorage

，您需要调用

localStorage.setItem(key,value);

将id为

键的对象
值
添加到本地存储中。你需要

let item = localStorage.getItem(key);

根据您的回答，我将代码更改为：
{if（this.state.sessionID===“-1”）return else return}/>
但是我得到了以下错误：“元素类型无效：需要字符串（对于内置组件）或类/函数（对于复合组件）但是得到：object。您可能忘记了从文件中导出组件，该文件在“是否可以发布您编辑的代码？”？或者提供一个codesandbox.io？你能把文件发布到你定义路由器的地方吗？或者在index.js中渲染
应用程序
组件？啊，该死，我觉得好蠢！很抱歉我没有在VideoGrid组件上点击save，这就是最近出现错误的原因。我可以看到它现在可以工作了，但它显示了我在同一条道路上（不是/videogrid），事实证明这正是我需要它工作的方式，非常感谢！
localStorage.setItem(key,value);

let item = localStorage.getItem(key);