如何彻底隐藏shinydashboard中的指定侧边栏标签页?
彻底隐藏Shiny Dashboard标签页的解决方法
你用visibility: hidden的问题在于,这个属性仅让元素不可见,但仍会保留它在页面上的占位空间,所以侧边栏里的标题位置还在。要彻底隐藏(完全移除占位,如同不存在),可以用以下几种方式:
方法1:直接修改menuItem的CSS样式
把visibility: hidden换成display: none,这个属性会彻底移除元素的占位,侧边栏里的条目会完全消失,对应的标签页内容也不会被渲染:
library(shiny) library(shinydashboard) library(shinyDashboardPlus) library(shinyjs) ui <- dashboardPage( dashboardHeader(), dashboardSidebar( sidebarMenu( id = "tabs", menuItem("Tab 1", tabName = "tab1"), menuItem("Tab 2", tabName = "tab2"), # 用display:none替代visibility:hidden menuItem("Invisible Tab", tabName = "invisible_tab", style = "display: none;") ) ), dashboardBody( tabItems( tabItem( tabName = "tab1", useShinyjs() ), tabItem( tabName = "tab2", useShinyjs(), h3("tab2") ), tabItem( tabName = "invisible_tab", h3("Invisible Tab Content") ) ) ) ) server <- function(input, output, session) { } shinyApp(ui, server)
方法2:用shinyjs动态隐藏(适合需要动态切换显示/隐藏的场景)
如果需要在运行时根据条件显示或隐藏标签页,可以用shinyjs的hide函数,同时指定侧边栏菜单对应的元素选择器:
library(shiny) library(shinydashboard) library(shinyDashboardPlus) library(shinyjs) ui <- dashboardPage( dashboardHeader(), dashboardSidebar( sidebarMenu( id = "tabs", menuItem("Tab 1", tabName = "tab1"), menuItem("Tab 2", tabName = "tab2"), # 给要隐藏的menuItem加个ID,方便选择 menuItem("Invisible Tab", tabName = "invisible_tab", id = "hidden_menu") ) ), dashboardBody( useShinyjs(), # 把useShinyjs放在dashboardBody最外层,全局生效 tabItems( tabItem( tabName = "tab1", h3("tab1") ), tabItem( tabName = "tab2", h3("tab2") ), tabItem( tabName = "invisible_tab", h3("Invisible Tab Content") ) ) ) ) server <- function(input, output, session) { # 初始化时隐藏侧边栏条目和对应的标签页内容 hide("hidden_menu") hide(selector = '[data-value="invisible_tab"]') } shinyApp(ui, server)
方法3:直接移除UI中的对应元素(永久隐藏)
如果不需要这个标签页存在于代码运行的UI中,直接注释或删除对应的menuItem和tabItem即可,这是最彻底的方式:
library(shiny) library(shinydashboard) library(shinyDashboardPlus) library(shinyjs) ui <- dashboardPage( dashboardHeader(), dashboardSidebar( sidebarMenu( id = "tabs", menuItem("Tab 1", tabName = "tab1"), menuItem("Tab 2", tabName = "tab2") # 移除第三个menuItem ) ), dashboardBody( tabItems( tabItem( tabName = "tab1", useShinyjs() ), tabItem( tabName = "tab2", useShinyjs(), h3("tab2") ) # 移除对应的tabItem ) ) ) server <- function(input, output, session) { } shinyApp(ui, server)
内容的提问来源于stack exchange,提问作者Ekapunk
相关产品推荐
相关产品推荐

