如何在Shiny App中实现点击表格单元格获取行列信息

要实现点击表格单元格后显示行列信息，需要修正原代码中的错误并调整JS函数的行列信息获取逻辑，修改后的完整代码如下：

library(reactable)
library(shiny)
library(htmlwidgets)

iris <- iris

ui <- fluidPage(
  reactable::reactableOutput("irisTABLE"),
  textOutput("cellDATA")  # 修正ID的单引号错误
)

server <- function(input, output) {
  output$irisTABLE = renderReactable({
    reactable(iris,
              onClick = JS("
                function(rowInfo, colInfo) {
                  // 获取行号（索引从0开始，+1转为自然行号）和列名
                  const rowNum = rowInfo.index + 1;
                  const colName = colInfo.id;
                  // 若需要列序号可改用：const colNum = colInfo.index + 1;
                  // 组合行列信息并传递给Shiny
                  Shiny.setInputValue('cell_data', `行：${rowNum}，列：${colName}`, { priority: 'event' })
                }
              ")
    )
  })

  output$cellDATA = renderText({
    paste0("选中的单元格：", input$cell_data)
  })
}

shinyApp(ui = ui, server = server)

关键修改说明 #

• 修正UI输出ID：原代码中textOutput("'cellDATA")多了单引号，导致输入输出无法正确绑定，改为textOutput("cellDATA")
• 获取正确的行列信息：
  • rowInfo.index是reactable内部的行索引（从0起始），加1后得到用户直观的行号
  • colInfo.id对应表格的列名（即iris数据框的列名），如果需要列序号，可使用colInfo.index + 1（同样索引从0起始）
• 实时传递数据：通过Shiny.setInputValue将组合后的行列信息发送给Shiny的input$cell_data，设置priority: 'event'确保点击事件实时响应

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