Shiny R Selectize Input 小部件大小以输入为目标

Shiny R Selectize Input widget size target the input

我的 Shiny 应用程序中有多个 selectizeInput。他们中的大多数不应该充满 variables/elements,但其中一个是。问题是盒子里的variables/elements越多,这个就越大,显示效果一点也不好。我找到了操作输入小部件的高度、字体、宽度等的解决方案:

    library(shiny)

    ui <- fluidPage(
      fluidRow(

        selectInput("speed", label=NULL, choices = list("1" = 1, "2" = 2), selected = 1),
        tags$head(tags$style(HTML(".selectize-input {height: 100px; width: 500px; font-size: 100px;}")))
      )

)
server <- function(input, output){}
shinyApp(ui, server)

这行得通。但是这个解决方案会影响我应用程序中的所有 selectizeInput,我只对一个 selectizeInput 感兴趣。有办法吗?

您可以使用一些高级 CSS 到 select .selectize-input 框。所以在 selectInput 结构中,具有实际 id 的元素被分配给一个 select 标签,你想要的框是 select 标签之后以下标签的第一个 child .我们可以使用 + 到 select 以下标记,并使用 > 到 select 包含 .selectize-input class 的第一个 child以下标记。

library(shiny)

ui <- fluidPage(
    tags$head(tags$style(HTML("#speed + div > .selectize-input {height: 100px; width: 500px; font-size: 100px;}"))),
    fluidRow(
        selectInput("speed", label=NULL, choices = list("1" = 1, "2" = 2), selected = 1),
        selectInput("speed2", label=NULL, choices = list("1" = 1, "2" = 2), selected = 1)
    )
)
server <- function(input, output){}
shinyApp(ui, server)

#ID + div > .selectize-input就是你要申请的。

尝试 运行 我的示例,我创建了两个 selectInput,只有第一个具有 CSS 样式。