Question

下面有一个闪亮的仪表板，我想知道在选择特定选项卡时是否有一种方法可以使左侧和右侧边栏默认保持隐藏状态。在这种情况下，标签'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)

Answer 1

通过shinyjs执行。观看addClass removeClass的工作方法，请查看。

当您位于“前”时，右栏关闭，并在“数据”选项卡上打开。

        ## 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，否则我不能使用闪亮的函数来更改该ID ，但这将非常棘手。
我添加了一些JavaScript runjs来隐藏右侧菜单，并在“ 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)

在Shinydashboard中选择特定选项卡时，默认情况下隐藏左侧和右侧边栏

1 个答案: