reactjs 如何添加条件链接到我的React应用程序?

eyh26e7m  于 2022-12-03  发布在  React
关注(0)|答案(1)|浏览(136)

我在我这边的导航栏上工作,如果用户点击配置文件图标,我希望他要么被重定向到我的登录页面,如果他没有登录,要么被发送到他的配置文件页面,如果他登录了。
我已经尝试添加条件路由,但没有工作,因为它没有改变任何东西,我尝试添加一个功能,以取代链接组件中的URL位置
在尝试了这两种方法都没有结果后,我想是否有可能添加条件链接,无论如何,但是如果有另一个工作的解决方案,我还没有尝试过随时添加它
我知道有一个关于条件链接的威胁已经关闭,但我不知道如何根据我的场景实现它
IM使用Reactv 18.0.2和React路由器dom v6
我感谢任何想法或提示

function App() {

  
let persID = JSON.parse(localStorage.getItem("currentUser")); 

// add conditional linking

  return (
    <>
    <div className="wrapper">
      <div className="topnav-right">
        <div className="tooltip"><Link to={`profile/${persID}`}><i class="material-icons" alt="profile">person</i></Link></div>
      </div>
    </div>

    <Routes>
      <Route path="/profile/:persID" element={ <Profile />} /> 
      <Route path="/profile/Login" element={<LoginFunction />} />
    </Routes>
    </>
  )
}
export default App;
oprakyz7

oprakyz71#

我不确定这是否适合您的用例,但是在登录页面中放置一个重定向如何?如果用户已经登录,登录页面将重定向到个人资料页面。
https://reactrouter.com/en/main/fetch/redirect

相关问题