shiny - 如何在发光的仪表板中手动折叠框

Question

发生问题时，我正在尝试手动折叠框。看来我只需要在框中添加"collapsed-box"类，就尝试使用了Shinyjs函数addClass，但是由于一个盒子没有id，我不知道该怎么做。这里是可用于测试可能解决方案的简单基本代码:

library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
      box(collapsible = TRUE,p("Test")),
      actionButton("bt1", "Collapse")
  )
)

server <- function(input, output) {
  observeEvent(input$bt1, {
    # collapse the box
  })
}

shinyApp(ui, server)

Answer 1

我从来没有尝试过使用盒子，所以请记住，我的回答可能很狭narrow。但是我快速浏览了一下，看起来仅仅在盒子上设置“collapsed-box”类实际上并没有使盒子折叠。因此，我的下一个想法是实际上以编程方式单击折叠按钮。

如您所说，没有与该框关联的标识符，所以我的解决方案是在id中添加一个box参数。我最初希望它是盒子的ID，但相反，它看起来像是将ID赋予盒子内的一个元素。没问题-这只是意味着要选择折叠按钮，我们需要获取id，在DOM树中查找以找到box元素，然后在DOM树中向下查找以找到按钮。

我希望我所说的一切都有意义。即使不行，此代码也应该可以正常工作，并希望可以使事情变得更清楚:)

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

jscode <- "
shinyjs.collapse = function(boxid) {
$('#' + boxid).closest('.box').find('[data-widget=collapse]').click();
}
"

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    useShinyjs(),
    extendShinyjs(text = jscode),
    actionButton("bt1", "Collapse box1"),
    actionButton("bt2", "Collapse box2"),
    br(), br(),
    box(id = "box1", collapsible = TRUE, p("Box 1")),
    box(id = "box2", collapsible = TRUE, p("Box 2"))
  )
)

server <- function(input, output) {
  observeEvent(input$bt1, {
    js$collapse("box1")
  })
  observeEvent(input$bt2, {
    js$collapse("box2")
  })
}

shinyApp(ui, server)