React - 用户登录后如何在导航栏中隐藏注册/登录？

Question

一旦用户登录，我希望能够隐藏注册和登录的链接。我正在使用反应。

以下是我导航中的链接：

<Navbar>
 <Nav.Item>
            <Nav.Link href="/Register">Register</Nav.Link>
          </Nav.Item>
          <Nav.Item>
            <Nav.Link href="/Login">Login</Nav.Link>
          </Nav.Item>
</Navbar>

我正在使用本地存储进行登录：

localStorage.setItem("userID", user);

Answer 1

您可以使用 localStorage.getItem('userID') 获取项目并使用它来隐藏链接

<Navbar>
          {!localStorage.getItem('userID') && (
            <Nav.Item>
          
              <Nav.Link href="/Register">Register</Nav.Link>
            </Nav.Item>
            <Nav.Item>
              <Nav.Link href="/Login">Login</Nav.Link>
            </Nav.Item>
          )}
</Navbar>

这样，只有在 localStorage.getItem('userID') 未定义或具有任何虚假值时才会显示链接