R Shiny如何让文本域输入的多行内容在DT表格单行中保留换行显示

问题原因 #

• 该现象和列定义为字符型无关，核心是HTML的渲染规则：textAreaInput返回的多行文本换行符为\n，但HTML默认不会将\n解析为换行，只有<br>标签才会被识别为换行标记
• escape = FALSE仅会让DT不转义HTML标签，本身不会处理文本里的换行符，因此单独设置不生效

解决方案1：替换换行符为HTML换行标签 #

仅需要在存储文本前，把文本中的换行符替换为<br>即可，修改后的完整可运行代码如下：

library(shiny)
library(DT)
library(shinyWidgets)

ui <- fluidPage(
    titlePanel("Multi-line row in Shiny Table"),
        mainPanel(
            textAreaInput(inputId = "Long_Text", label = "TEXT:", rows = 5, resize = "both"), br(),
            actionButton("Add_text", "New Text"), br(),
            DT::dataTableOutput("Text_Table")
        )
)

server <- function(input, output, session) {
    Text_DF <- reactiveValues(data = data.frame(Text = character()))
    
    observeEvent(input$Add_text, {
        # 新增：将换行符替换为HTML换行标签，兼容Windows/macOS换行格式
        processed_text <- gsub("[\r\n]", "<br>", input$Long_Text)
        Text_DF$data <- rbind(Text_DF$data, data.frame(Text = processed_text))
    })
    
    output$Text_Table = renderDataTable({
        Text_DF$data
    }, escape = FALSE)
}

shinyApp(ui = ui, server = server)

解决方案2：使用CSS样式识别原生换行符 #

如果不想修改原始文本内容，可以通过给DT列添加CSS样式white-space: pre-line，让HTML自动识别\n作为换行标记，不需要替换文本内容，修改后的代码如下：

library(shiny)
library(DT)
library(shinyWidgets)

ui <- fluidPage(
    titlePanel("Multi-line row in Shiny Table"),
        mainPanel(
            textAreaInput(inputId = "Long_Text", label = "TEXT:", rows = 5, resize = "both"), br(),
            actionButton("Add_text", "New Text"), br(),
            DT::dataTableOutput("Text_Table")
        )
)

server <- function(input, output, session) {
    Text_DF <- reactiveValues(data = data.frame(Text = character()))
    
    observeEvent(input$Add_text, {
        Text_DF$data <- rbind(Text_DF$data, data.frame(Text = input$Long_Text))
    })
    
    output$Text_Table = renderDataTable({
        datatable(Text_DF$data,
                  # 给第一列添加自动识别换行的样式
                  columnDefs = list(list(
                      targets = 0,
                      render = JS("function(data, type, row, meta) {",
                                  "return '<span style=\"white-space: pre-line;\">' + data + '</span>';",
                                  "}")
                  )))
    }, escape = FALSE)
}

shinyApp(ui = ui, server = server)

额外说明 #

不需要更换其他表格包，DT本身完全支持该需求，两种方案都可以稳定实现单单元格多行文本展示。

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