как закрыть выпадающее меню гамбургера, если в Shiny была выбрана опция - PullRequest
Новая
       27

как закрыть выпадающее меню гамбургера, если в Shiny была выбрана опция

0 голосов
/ 16 мая 2019

У меня есть складное меню Navbar в R Shiny.Когда меню свернуто, и я нажимаю кнопку «Гамбургер», появляются параметры.Когда я нажимаю на одну из опций, выбирается другая панель (по праву), но меню остается открытым.

Можно ли сделать так (с помощью css?), Что «выпадающее меню» (т.е. списокиз вариантов) закрывается, как только я выбрал один из вариантов?

Код выглядит следующим образом: 

library(shiny)

ui <- tagList(
  navbarPage(
    title = NULL, id = "navBar", collapsible = TRUE,

    tabPanel(title = "Panel1", uiOutput('panel1')),
    tabPanel(title = "Panel2", uiOutput('panel2')),
    tabPanel(title = "Panel3", uiOutput('panel3'))
  )
)

server <- function(input, output, session) {
  output$panel1 <- renderUI({p("This is panel 1")})
  output$panel2 <- renderUI({p("This is panel 2")})
  output$panel3 <- renderUI({p("This is panel 3")})
}  

shinyApp(ui = ui, server = server)

1 Ответ

1 голос
/ 17 мая 2019

Вы можете прослушать страницу navbarPage с помощью input$navBar (ваш идентификатор в navbarPage()) и вызвать изменения с помощью JavaScript. 

  observeEvent(input$navBar, {
    runjs('
      var elem = document.getElementsByClassName("navbar-collapse")[0]
      elem.setAttribute("aria-expanded", "false");
      elem.setAttribute("class", "navbar-collapse collapse");
    ')
  })

Воспроизводимый пример: 

library(shiny)
library(shinyjs)

ui <- tagList(
  useShinyjs(),
  navbarPage(
    title=NULL, id = "navBar", collapsible = TRUE,

    tabPanel(title = "Panel1", uiOutput('panel1')),
    tabPanel(title = "Panel2", uiOutput('panel2')),
    tabPanel(title = "Panel3", uiOutput('panel3'))
  )
)

server <- function(input, output, session) {
  output$panel1 <- renderUI({p("This is panel 1")})
  output$panel2 <- renderUI({p("This is panel 2")})
  output$panel3 <- renderUI({p("This is panel 3")})

  observeEvent(input$navBar, {
    runjs('
      var elem = document.getElementsByClassName("navbar-collapse")[0]
      elem.setAttribute("aria-expanded", "false");
      elem.setAttribute("class", "navbar-collapse collapse");
    ')
  })
}

shinyApp(ui = ui, server = server)
...