如何让Shiny中DT表格的分页控件正常显示在一行？

针对你遇到的DT表格分页控件换行成两行的问题，可通过以下方式结合解决：

关键修改步骤 #

1. 移除UI代码中重复的包加载语句（原代码存在冗余的library()调用）
2. 通过CSS强制分页相关元素横向布局，避免换行
3. 可选优化DT配置，进一步调整控件布局逻辑

修改后的完整代码 #

library(shiny)
library(ggplot2)
library(DT)

# Define UI
ui <- fluidPage(
  tags$head(
    tags$style(HTML("
      .container-fluid {
        width: 100% !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
      }
      /* 让长度选择框和分页控件处于同一行 */
      .dataTables_wrapper .dataTables_length,
      .dataTables_wrapper .dataTables_paginate {
        display: inline-block;
        vertical-align: middle;
        margin: 8px 0;
      }
      /* 分页控件靠右排列，避免和长度选择框拥挤 */
      .dataTables_wrapper .dataTables_paginate {
        float: right;
        white-space: nowrap; /* 强制分页按钮不换行 */
      }
      /* 缩小分页按钮间距，减少窄空间下的换行概率 */
      .dataTables_wrapper .dataTables_paginate .paginate_button {
        margin-left: 2px !important;
        padding: 4px 6px !important;
      }
    "))
  ),
  sidebarLayout(
    sidebarPanel(
      selectInput("variable", "Select Variable:", choices = c("setosa", "versicolor", "virginica"), selected = "setosa"),
      sliderInput("range", "Select Range:", min = 4.3, max = 7.9, value = c(4.3, 7.9))
    ),
    mainPanel(
      fluidRow(
        column(width = 8, plotOutput("barplot", height = "300px")),
        column(width = 4, DTOutput("table"))
      )
    )
  )
)

# Define server
server <- function(input, output) {
  
  # Generate input data based on user selections
  input_data <- reactive({
    iris[iris$Species == input$variable & iris$Sepal.Length >= input$range[1] & iris$Sepal.Length <= input$range[2], ]
  })
  
  # Render bar plot
  output$barplot <- renderPlot({
    ggplot(input_data(), aes(x = Species, fill = Species)) +
      geom_bar() +
      labs(title = "Bar Plot")
  })
  
  # Render table
  output$table <- renderDT({
    datatable(
      input_data(), 
      options = list(
        pageLength = 5
        # 可选：若仍有空间问题，可隐藏长度选择框，添加参数：dom = 'frtip'
      )
    )
  })
}

# Run the app
shinyApp(ui, server)

效果说明 #

• CSS中的white-space: nowrap强制分页按钮区域保持一行，display: inline-block让长度选择框和分页控件横向排列
• 缩小分页按钮的间距与内边距，适配窄列（如width=4的column）布局
• 若空间仍不足，可通过dom = 'frtip'参数隐藏每页条数选择框，进一步节省横向空间

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