r-在shinydashboard中选择特定选项卡时,默认情况下隐藏左侧栏和右侧栏



我下面有一个闪亮的面板,我想知道是否有一种方法可以在选择特定选项卡时默认隐藏左右侧边栏。在这种情况下,选项卡'Front'

## app.R ##
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(DT)
library(shinyWidgets)
ui <- tags$body(class="skin-blue sidebar-mini control-sidebar-open",dashboardPagePlus(
dashboardHeaderPlus(
enable_rightsidebar = TRUE,
rightSidebarIcon = "gears",
fixed = T
),
dashboardSidebar(
),
dashboardBody(
tags$hr(),
tabsetPanel(
id ="tabA",
type = "tabs",
tabPanel("Front",icon = icon("accusoft")),
tabPanel("Data", icon = icon("table")

)
)
),
rightsidebar = rightSidebar(
)))
server <- function(input, output) {

}
shinyApp(ui = ui, server = server)

shinyjs执行。看我怎么做addClassremoveClass,看看它。

当您在"Front"(前部(并在"Data"(数据(选项卡上打开时,左右栏关闭。

## app.R ##
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(DT)
library(shinyWidgets)
library(shinyjs)
ui <- dashboardPagePlus(
dashboardHeaderPlus(
enable_rightsidebar = TRUE,
rightSidebarIcon = "gears",
fixed = T
),
dashboardSidebar(
),
dashboardBody(
useShinyjs(),
tags$hr(),
tabsetPanel(
id ="tabA",
type = "tabs",
tabPanel("Front",icon = icon("accusoft")),
tabPanel("Data", icon = icon("table")

)
)
),
rightsidebar = rightSidebar(
)
)
server <- function(input, output) {
observe({
if (input$tabA == "Front") {
addClass(selector = "body", class = "sidebar-collapse")
removeClass(selector = "body", class = "control-sidebar-open")
} else {
removeClass(selector = "body", class = "sidebar-collapse")
addClass(selector = "body", class = "control-sidebar-open")
}
})
}
shinyApp(ui = ui, server = server)

在评论中回答您的附加问题:

  • 我检查了文档,右侧边栏菜单没有ID,所以我不能使用闪亮的函数来更改它,除非你在启动时更改shinydashboardPlus的源代码以给它一个ID,但这将非常棘手
  • 我添加了一些javascriptrunjs来偷偷隐藏右侧菜单,并在"Front"上添加了一个按钮。当您单击它时,将显示右侧栏
## app.R ##
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(DT)
library(shinyWidgets)
library(shinyjs)
ui <- dashboardPagePlus(
dashboardHeaderPlus(
enable_rightsidebar = TRUE,
fixed = T
),
dashboardSidebar(
),
dashboardBody(
useShinyjs(),
tags$hr(),
tabsetPanel(
id ="tabA",
type = "tabs",
tabPanel(title = "Front", icon = icon("accusoft"),
actionButton(inputId = "openright", label = "Open Right")
),
tabPanel("Data", icon = icon("table")
)
)
),
rightsidebar = rightSidebar(
)
)
server <- function(input, output) {
observe({
runjs('document.querySelectorAll(".navbar-custom-menu")[1].style.visibility = "hidden"')
if (input$tabA == "Front") {
addClass(selector = "body", class = "sidebar-collapse")
removeClass(selector = "body", class = "control-sidebar-open")
} else {
removeClass(selector = "body", class = "sidebar-collapse")
addClass(selector = "body", class = "control-sidebar-open")
}
})
observeEvent(input$openright, {addClass(selector = "body", class = "control-sidebar-open")})
}
shinyApp(ui = ui, server = server)

相关内容

  • 没有找到相关文章

最新更新