如何在闪亮的应用程序中观察 JavaScript 按钮

Question

我正在寻求帮助，请注意何时单击带有 navbarPage 的 Shiny App 导航栏中的按钮。

我在 Shiny 导航栏中添加了一个带有一些 javascript 的按钮。我为按钮标签（'id = btn_show'）提供了一个 id，并引入了一个观察事件来监听'input$btn_show'。但是没有观察到按钮……请问需要什么？谢谢

library(shiny)
library(shinyjs)

ui <- navbarPage(
  title = 'Button Up',
  tabPanel('Tab 1'),
  tabPanel('Tab 1')
  , tags$script(HTML(
    "var header = $('.navbar> .container-fluid');
                   header.append('<div style=\"float:right; style=\"valign:middle;\"><button id = \"btn_show\">Show Controls</button></div>');
                    console.log(header)"))
  
  
)

server <- function(input, output, session) {
  
  observeEvent(input$btn_show,{
    
    print('The button was observed')
    
  })
  
}

shinyApp(ui, server)

Answer 1

将onclick 属性添加到您的按钮：

<button id=\"btn_show\" onclick=\"Shiny.setInputValue(\\\"btn_show\\\", true, {priority: \\\"event\\\"})\">Show Controls</button>

我不确定三个反斜杠是否有效。如果没有，定义一个函数：

function f(){
  Shiny.setInputValue(\"btn_show\", true, {priority: \"event\"})
}

然后onclick = \"f()\"。

编辑

像这样工作：

  tags$script(HTML(
    "var header = $('.navbar> .container-fluid');
    var f = function(){Shiny.setInputValue(\"btn_show\", true, {priority: \"event\"})};
    header.append('<div style=\"float:right; valign:middle;\"><button id=\"btn_show\" onclick=\"f()\">Show Controls</button></div>');
    console.log(header)"))