bslib::page_navbar 内的shinyWidgets::pickerInput 下拉功能不起作用

Question

我对这个问题有一个小表述：

# R v4.2.3
# RStudio Pro v2023.06.0
library(shiny) # v1.7.2
library(bslib) # v0.5.0
library(shinyWidgets) # v0.7.6

page_navbar(
    header = pickerInput('pickId', choices = month.abb),
    title = 'reprex',
    nav('tab 1', 'content 1'),
    nav('tab 2', 'content 2')
)

用户界面将显示正常，但选择器输入显示为灰色，并且下拉菜单不会弹出。

如果将 pickerInput 放置在 UI 中的其他位置，它也不起作用，例如：

page_navbar(
    title = 'reprex',
    nav_panel('tab 1', 'content 1'),
    nav_panel('tab 2', pickerInput('pickId', choices = month.abb))
)

将此与类似示例进行比较：

page_navbar(
    header = selectInput('selectId', 'label', choices = month.abb),
    title = 'reprex',
    nav_panel('tab 1', 'content 1'),
    nav_panel('tab 2', selectInput('selectId2', 'label', choices = month.abb))
)

可以正常工作。

具体是什么技术问题导致了这个问题？ 我怎样才能做到这一点？接受的答案必须使用 pickerInput。

Answer 1

更新答案，2024 年 5 月

由于这个问题在最近的一个问题中被提到，并且自原始答案编写以来发生了一些变化，我更新了这个答案。现在有一个也适用于 bootstrap 5 的解决方案。

虽然OP在

shiny

之外的问题中给出的最小示例似乎自

bslib 0.6.0

以来一直有效，但在

pickerInput

应用程序内的bootstrap 5和

shiny

似乎仍然存在问题（尽管例如） #535 同时关闭），至少如果

pickerInput

是在

header

中的

page_navbar()

中提供的。

原因显然是，在这种情况下，

pickerInput

是用属性

data-toggle = "dropdown"

构造的，而在bootstrap 5中必须使用

data-bs-toggle = "dropdown"

。因此，如果我们改变这个属性，就可以获得一个解决方案，例如通过使用

htmltools::tagQuery

:

library(shiny) # ‘1.8.1.1’
library(bslib) # ‘0.7.0’
library(shinyWidgets) # ‘0.8.6’

ui <- fluidPage(
  page_navbar(
    header = htmltools::tagQuery(pickerInput('pickId', choices = month.abb))$
      find(".btn")$
      removeAttrs("data-toggle")$
      addAttrs(`data-bs-toggle` = "dropdown")$
      allTags(),
    title = 'reprex',
    nav_panel('tab 1', 'content 1'),
    nav_panel('tab 2', 'content 2')
  )
)

shinyApp(ui, \(...) {})

原始答案，2023 年 7 月

出现此问题的原因可能是

pickerInput()

和

bslib

之间的兼容性问题（另请参阅 GitHub 上的 this 未解决问题）。

但是，似乎让

pickerInput()

工作的是切换到依赖于另一个 BootsTrap 版本的主题。

library(shiny)
library(bslib)
library(shinyWidgets)

page_navbar(
    theme = bs_theme(version = 3, bootswatch = "default"),
    header = pickerInput('pickId', choices = month.abb),
    title = 'reprex',
    nav_panel('tab 1', 'content 1'),
    nav_panel('tab 2', 'content 2')
)