r - Shiny 的navbarPage中的搜索字段

我尝试在navbarPage之后将全局搜索字段添加到我的tabPanel中。我不确定是否可行，因为我所有的测试都在textInput之外生成了navbar。

rStudio闪亮的布局指南指向bootstrap navbar documentation，他们实际上正是在该位置进行的。但是我无法使用闪亮的应用程序重现它。

library(shiny)

ui <- shinyUI(
  shiny::navbarPage('test',
    shiny::tabPanel('my app',
   fluidPage(

  # Application title
  titlePanel("Old Faithful Geyser Data"),

  # Sidebar with a slider input for number of bins
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins",
                  "Number of bins:",
                  min = 1,
                  max = 50,
                  value = 30)
    ),

    # Show a plot of the generated distribution
    mainPanel(
      plotOutput("distPlot")
    )
  ))),

  ### Still inside navbarPage
  shiny::textInput("text",
                   label=h3("Text input"),
                   value="should be inside the navbar!")
))

server <- function(input, output, session) {
  output$distPlot <- renderPlot({

    # generate bins based on input$bins from ui.R
    x    <- faithful[, 2]
    bins <- seq(min(x), max(x), length.out = input$bins + 1)

    # draw the histogram with the specified number of bins
    hist(x, breaks = bins, col = 'darkgray', border = 'white')

  })
}

shinyApp(ui, server)

最佳答案

您可以通过稍微操作导航栏HTML来做到这一点。 Valter是正确的-您可以通过完全用HTML构造菜单而不是使用Shiny来实现此目的。但是，有一种更简单的方法:您可以在常规的Shiny中构建导航栏，然后使用htmltools对其稍作修改。我认为这是目前提出的解决方案中最干净的一种快速解决方案:

library(shiny)

navbarPageWithInputs <- function(..., inputs) {
  navbar <- navbarPage(...)
  form <- tags$form(class = "navbar-form", inputs)
  navbar[[3]][[1]]$children[[1]] <- htmltools::tagAppendChild(
    navbar[[3]][[1]]$children[[1]], form)
  navbar
}

ui <- navbarPageWithInputs(
  "Test app",
  tabPanel("tab1", "tab 1", textOutput("out")),
  tabPanel("tab2", "tab 2"),
  inputs = textInput("search", NULL, placeholder = "Search")
)

server <- function(input, output, session) {
  output$out <- renderText(input$search)
}

shinyApp(ui = ui, server = server)

基本上，我创建了一个navbarPageWithInputs()函数，该函数接受与navbarPage()相同的所有参数，还接受一个inputs参数。该函数所做的全部工作就是调用常规navbarPage()，然后将给定的输入添加到HTML中。