【问题标题】：R: Popovers don't trigger in shiny reactive UIR：弹出框不会在闪亮的反应式 UI 中触发
【发布时间】：2016-06-16 17:01:53
【问题描述】：

我目前正在开发一个闪亮的小工具，并且遇到了 renderUI() 生成时 Bootstrap 弹出框不会触发的小问题。谁能解释为什么会这样？

我对 js 不是很熟悉，所以对于这个我想念的问题可能有一个明显的答案。

下面的示例重现了该问题。简而言之：创建了一个呈现侧边栏和绘图的小工具；侧边栏中有两个应该触发弹出框的链接标签，第一个在 UI 对象中生成，第二个由uiOutput() 和renderUI() 组合生成。至少对我来说，反应式弹出框不会触发。

MWE：

library(shiny)
library(miniUI)

# Functions for popovers --------------------------------------------------

popoverInit <- function() {
  tags$head(
    tags$script(
      "$(document).ready(function(){$('[data-toggle=\"popover\"]').popover();});"
    )
  )
}
popover <- function(content, pos, ...) {
  tagList(
    singleton(popoverInit()),
    tags$a(href = "#pop", `data-toggle` = "popover", `data-placement` = paste("auto", pos),
           `data-original-title` = "", title = "", `data-trigger` = "hover",
           `data-html` = "true", `data-content` = content, ...)
  )
}

# Gadget function ---------------------------------------------------------

reactive_popovers <- function(data, xvar, yvar) {

  ui <- miniPage(
    gadgetTitleBar("Reactive popovers"),
    fillRow(  # Sidebar and plot.
      flex = c(1, 10),
      tagList(
        tags$hr(),

        ## This popover works fine:
        popover("No problems", pos = "right", "Working popover"),

        tags$hr(),

        ## This one doesn't.
        uiOutput("reactive_popover")
      ),

      ## A pointless plot.
      miniContentPanel(
        plotOutput("plot", height = "100%")
      )
    )
  )

  server <- function(input, output, session) {

    ## Render popover.
    output$reactive_popover <- renderUI({
      popover("Popover content", "right", "Dead popover")
    })

    ## Render plot.
    output$plot <- renderPlot({
      plot(mpg ~ hp, data = mtcars)
    })
  }

  runGadget(ui, server, viewer = browserViewer())
}

reactive_popovers()

【问题讨论】：

标签： javascript r twitter-bootstrap shiny

【解决方案1】：

我认为这是因为renderUI 中的popover 是在js 绑定之后创建的，因此它不会被初始化。

根据this post 的回答，您可以这样做：

popoverInit <- function() {
  tags$head(
    tags$script(
      "$(document).ready(function(){
      $('body').popover({
            selector: '[data-toggle=\"popover\"]',
            trigger: 'hover'        
        });});"
    )
  )
}

【讨论】：