在带有 reactjs 的移动设备中使用时，如何隐藏我网站的导航栏？
How do I hide NavBar of my website when using in mobile with reactjs?
我正在用 reactjs 建立一个网站，我想实现像 Instagram 这样的东西。因此，当用户在 PC 上访问该网站时，他们应该看到导航栏，如果用户在 Thier phone 上访问它，那么他们应该看到底部标签导航，并且导航栏应该被隐藏。我还附上了我的桌面和移动设计照片 UI 这样你们就可以有更好的主意。此外，我没有使用任何 UI 库，只是简单的 reactjs。
对此最简单的解决方案是拥有两个版本的导航栏。
一个 Nav 和一个 NavMobile。
您可以根据 min/max 屏幕尺寸使用 css 媒体查询 hide/show 它们，这是最常见的做法之一
我建议您使用 CSS 的媒体查询，而不是采取任何其他方式。它会让你的生活变得轻松。
您只需要指示要隐藏的代码部分。
假设你的导航栏 class 然后在媒体查询中如下所示，并将 bootstrap 的 CDN 放到你的页面。
即
@media query("Size for what you want to hide navbar)(i.e. 480px or 320px)
.nav {
visibility; hidden;
}
我正在用 reactjs 建立一个网站，我想实现像 Instagram 这样的东西。因此，当用户在 PC 上访问该网站时，他们应该看到导航栏，如果用户在 Thier phone 上访问它，那么他们应该看到底部标签导航，并且导航栏应该被隐藏。我还附上了我的桌面和移动设计照片 UI 这样你们就可以有更好的主意。此外，我没有使用任何 UI 库，只是简单的 reactjs。
对此最简单的解决方案是拥有两个版本的导航栏。
一个 Nav 和一个 NavMobile。
您可以根据 min/max 屏幕尺寸使用 css 媒体查询 hide/show 它们，这是最常见的做法之一
我建议您使用 CSS 的媒体查询，而不是采取任何其他方式。它会让你的生活变得轻松。 您只需要指示要隐藏的代码部分。 假设你的导航栏 class 然后在媒体查询中如下所示，并将 bootstrap 的 CDN 放到你的页面。 即
@media query("Size for what you want to hide navbar)(i.e. 480px or 320px)
.nav {
visibility; hidden;
}