Shiny中如何仅关闭嵌套的modalDialog？避免父子弹窗同时关闭

你遇到的问题是因为Shiny默认的modalButton会调用dismissModal()函数，而这个函数在没有指定特定模态框ID的情况下，会关闭当前会话中所有打开的模态框。要只关闭嵌套的子模态框，我们可以通过给子模态框设置唯一ID，然后用自定义按钮触发只关闭该ID模态框的动作来实现。

下面是修改后的完整代码：

library(shiny)

shinyApp(
  ui <- fluidPage(
    actionButton("one","Press")
  ),
  server <- function(input, output,session) {
    observeEvent(input$one,{
      showModal(modalDialog(
        actionButton("two","Press 2"),
        footer = tagList(
          modalButton("Cancel")
        )
      ))
    })
    
    observeEvent(input$two,{
      # 给子模态框设置唯一ID
      showModal(modalDialog(
        "OKAY",
        id = "child_modal", # 关键：添加专属ID
        footer = tagList(
          # 用自定义按钮替代默认modalButton，触发指定关闭动作
          actionButton("close_child", "Cancel", 
                       onclick = "Shiny.setInputValue('close_child_trigger', Math.random())")
        )
      ))
    })
    
    # 监听关闭按钮的触发信号，仅关闭子模态框
    observeEvent(input$close_child_trigger, {
      removeModal(modalId = "child_modal")
    })
  }
)

代码细节解释： #

• 给子模态框加ID：在modalDialog()中添加id = "child_modal"，让我们能精准定位要关闭的目标模态框。
• 替换默认按钮：用actionButton替代modalButton，通过onclick生成一个随机输入值来触发服务器端的动作（避免按钮重复点击时的信号冲突）。
• 精准关闭动作：通过observeEvent监听自定义按钮的触发信号，调用removeModal(modalId = "child_modal")只关闭子模态框，父模态框会保留。

如果你使用的是Shiny 1.7.0及以上版本，还可以进一步简化代码，直接在按钮的onclick中调用JS方法关闭指定模态框，省去服务器端的监听逻辑：

library(shiny)

shinyApp(
  ui <- fluidPage(
    actionButton("one","Press")
  ),
  server <- function(input, output,session) {
    observeEvent(input$one,{
      showModal(modalDialog(
        actionButton("two","Press 2"),
        footer = tagList(
          modalButton("Cancel")
        )
      ))
    })
    
    observeEvent(input$two,{
      showModal(modalDialog(
        "OKAY",
        id = "child_modal",
        footer = tagList(
          actionButton("close_child", "Cancel", 
                       onclick = "Shiny.removeModal('child_modal')")
        )
      ))
    })
  }
)

这样点击子模态框的Cancel按钮时，就只会关闭当前的子模态框，父模态框会正常保留在页面上。

内容的提问来源于stack exchange，提问作者jyjek