bslib+Bootstrap5环境下navbarPage中pickerInput失效问题求解

这个问题的核心原因是：当navbarPage作为Shiny应用的根UI元素时，shinyWidgets的pickerInput所需的JavaScript和CSS资源没有被自动注入到页面中。在外层额外添加pickerInput会触发这些资源的全局加载，间接修复了内部控件的异常。

以下是无需额外添加无用pickerInput的解决方案：

方案1：显式加载pickerInput依赖资源 #

在UI的tags$head中，通过提取pickerInput的依赖对象，手动引入所需的JS和CSS资源：

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

ui <- navbarPage(
  theme = bs_theme(version = 5),
  "测试应用",
  tabPanel(
    "Tab1",
    pickerInput("input1", "选择项1", choices = c("A", "B", "C")),
    pickerInput("input2", "选择项2", choices = c("X", "Y", "Z"))
  ),
  # 手动注入pickerInput的依赖资源
  tags$head(
    singleton(
      htmltools::attachDependencies(
        tags$div(),
        shinyWidgets::pickerInput("temp", "", choices = "")$dependencies
      )
    )
  )
)

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

shinyApp(ui, server)

方案2：使用useShinyWidgets()强制初始化资源 #

在UI的任意位置（比如tabPanel内部）添加useShinyWidgets()函数，它会显式加载shinyWidgets的所有依赖资源，包含pickerInput需要的部分：

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

ui <- navbarPage(
  theme = bs_theme(version = 5),
  "测试应用",
  tabPanel(
    "Tab1",
    useShinyWidgets(), # 显式触发资源加载
    pickerInput("input1", "选择项1", choices = c("A", "B", "C")),
    pickerInput("input2", "选择项2", choices = c("X", "Y", "Z"))
  )
)

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

shinyApp(ui, server)

这两种方案都能确保pickerInput的依赖资源被正确加载，无需添加冗余控件，同时保留bslib Bootstrap5和navbarPage的原有配置。

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