在reactjs中注销后更改导航栏链接

import React, { useState } from 'react';
import { Link } from 'react-router-dom';

const Navbar = () => {
  const [isLoggedIn, setIsLoggedIn] = useState(true); // 初始值设为已登录

  // 处理注销操作
  const handleLogout = () => {
    // 执行注销操作，将isLoggedIn状态设为false
    setIsLoggedIn(false);
  };

  return (
    <nav>
      <ul>
        <li>
          <Link to="/">首页</Link>
        </li>
        <li>
          <Link to="/dashboard">仪表盘</Link>
        </li>
        <li>
          {isLoggedIn ? (
            <button onClick={handleLogout}>注销</button>
          ) : (
            <Link to="/login">登录</Link>
          )}
        </li>
      </ul>
    </nav>
  );
};

export default Navbar;

import React from 'react';
import Navbar from './Navbar';

const App = () => {
  return (
    <div>
      <Navbar />
      {/* 其他页面内容 */}
    </div>
  );
};

export default App;