如何使react类组件在登录后保持其状态，并根据组件中当前可用的状态更改可用路由？

// AuthContext.js
import React from 'react';

const AuthContext = React.createContext();

export default AuthContext;

// App.js
import React from 'react';
import { BrowserRouter as Router, Route, Redirect } from 'react-router-dom';
import AuthContext from './AuthContext';
import PrivateRoute from './PrivateRoute';
import LoginPage from './LoginPage';
import HomePage from './HomePage';

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isLoggedIn: false,
      user: null,
    };
  }

  handleLogin = (user) => {
    this.setState({
      isLoggedIn: true,
      user: user,
    });
  }

  handleLogout = () => {
    this.setState({
      isLoggedIn: false,
      user: null,
    });
  }

  render() {
    return (
      <AuthContext.Provider value={{
        isLoggedIn: this.state.isLoggedIn,
        user: this.state.user,
        login: this.handleLogin,
        logout: this.handleLogout,
      }}>
        <Router>
          <Route exact path="/login" component={LoginPage} />
          <PrivateRoute exact path="/home" component={HomePage} />
          <Route exact path="/">
            {this.state.isLoggedIn ? <Redirect to="/home" /> : <Redirect to="/login" />}
          </Route>
        </Router>
      </AuthContext.Provider>
    );
  }
}

export default App;

// PrivateRoute.js
import React from 'react';
import { Route, Redirect } from 'react-router-dom';
import AuthContext from './AuthContext';

const PrivateRoute = ({ component: Component, ...rest }) => (
  <AuthContext.Consumer>
    {({ isLoggedIn }) => (
      <Route
        {...rest}
        render={(props) =>
          isLoggedIn ? <Component {...props} /> : <Redirect to="/login" />
        }
      />
    )}
  </AuthContext.Consumer>
);

export default PrivateRoute;

// LoginPage.js
import React from 'react';
import AuthContext from './AuthContext';

class LoginPage extends React.Component {
  static contextType = AuthContext;

  handleLogin = () => {
    // Perform login logic
    const user = { name: 'John' };
    this.context.login(user);
  }

  render() {
    return (
      <div>
        <h1>Login Page</h1>
        <button onClick={this.handleLogin}>Login</button>
      </div>
    );
  }
}

export default LoginPage;

// HomePage.js
import React from 'react';
import AuthContext from './AuthContext';

class HomePage extends React.Component {
  static contextType = AuthContext;

  handleLogout = () => {
    // Perform logout logic
    this.context.logout();
  }

  render() {
    return (
      <div>
        <h1>Welcome, {this.context.user.name}!</h1>
        <button onClick={this.handleLogout}>Logout</button>
      </div>
    );
  }
}

export default HomePage;