单击后折叠仪表板侧栏菜单

问题描述 投票:1回答:1

对于下面的代码,我希望有一个菜单(dashboardSidebar),该菜单会在单击除item2以外的任何menuItem时折叠。

library(shiny)
library(shinydashboard)

ui <- dashboardPage(

  dashboardHeader(),

  dashboardSidebar(collapsed = TRUE, sidebarMenu(id = "tabs",
       menuItem("item1", tabName = "item1", icon = icon("newspaper")),
       menuItem("item2", tabName = "item2", icon = icon("tv"),
         menuItem("item2_1",  tabName = "item2_1", icon = icon("tasks")),
         menuItem("item2_2", tabName = "item2_2", icon = icon("flag-checkered")),
         menuItem("item2_3", tabName = "item2_3", icon = icon("user-clock"))))),

  dashboardBody())

server <- function(input, output) {}

shinyApp(ui, server)

谢谢

r shiny shinydashboard
1个回答
1
投票

请检查以下内容:

library(shiny)
library(shinydashboard)
library(shinyjs)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(collapsed = TRUE, sidebarMenu(
    id = "tabs",
    menuItem("item1", tabName = "item1", icon = icon("newspaper")),
    menuItem(
      "item2",
      tabName = "item2",
      icon = icon("tv"),
      menuItem("item2_1",  tabName = "item2_1", icon = icon("tasks")),
      menuItem(
        "item2_2",
        tabName = "item2_2",
        icon = icon("flag-checkered")
      ),
      menuItem("item2_3", tabName = "item2_3", icon = icon("user-clock"))
    )
  )),
  dashboardBody(useShinyjs(),
                tabItems(
                  tabItem(tabName = "item1",
                          h2("item1 tab content")),
                  tabItem(tabName = "item2_1",
                          h2("item2_1 tab content")),
                  tabItem(tabName = "item2_2",
                          h2("item2_2 tab content")),
                  tabItem(tabName = "item2_3",
                          h2("item2_3 tab content"))
                ))
)

server <- function(input, output, session) {
  observeEvent(input$tabs, {
    shinyjs::toggleClass(selector = "body", class = "sidebar-collapse")
  }, ignoreInit = TRUE)
}

shinyApp(ui, server)

唯一的缺点是,两次选择相同的menuItem不会折叠边栏,因为input$tabs保持不变。

© www.soinside.com 2019 - 2024. All rights reserved.