我尝试在我的Web应用程序中实现一个导航栏功能，它应该根据redux状态中的布尔值切换呈现的信息。现在，当用户未登录时，使用我的used选择器获取的对象是空的，这意味着它是一个真实的值，因此不允许我如我所愿地切换navabr上的元素。有没有办法做到这一点，而不修改我的redux状态？
先谢谢你。

import './App.css';
import { Route, Routes, Link, Redirect, Navigate } from "react-router-dom";
import { useEffect, useState } from 'react';
import { useSelector } from 'react-redux';
import SearchBar from "./components/searchBar";
import Main from './components/main';
import Login from './components/login';
import Register from './components/register';

let linkStyle = { textDecoration: "none", color: "white" };

function App() {

  // fetching redux status
  let user = useSelector(state => state.loginStatus.user)
  let loginStatus = useSelector(state => state.loginStatus.isLoggedIn)
  console.log(loginStatus)

  const [isActive, setIsActive] = useState(false);

  const [isLoggedIn, setIsLoggedIn] = useState(false);
  const [avatar, setAvatar] = useState({});

  useEffect(() => {
    if (loginStatus) {
      setIsLoggedIn(loginStatus)
      setAvatar(user)
    }
  }, [loginStatus, isLoggedIn, isActive, avatar])

  return (
    <div className="App">
      <nav className="navbar">
        <div className="logo"><Link to={'/'} onClick={() => setIsActive(false)}><img src='https://cdn-icons-png.flaticon.com/512/201/201623.png' /></Link></div>
        <h1 className="title">Travel.com</h1>
        {
          isLoggedIn && (<ul className='menu'>
            <li className="link"><Link style={linkStyle} to='/login' onClick={() => setIsActive(true)}>Log-in</Link></li>
            <li className="link"><Link style={linkStyle} to='/register' onClick={() => setIsActive(true)}>Register</Link></li>
          </ul>)
        }
        { /*
          isLoggedIn && (
            <div className="avatar">
              <h6> Hi avatar.user_name!</h6>
            </div>
          ) */
        }

      </nav>