如何将 'afterColumnResize' 事件与 'rhandsontable' 一起使用？

Posted 2023-03-22

【中文标题】如何将 \'afterColumnResize\' 事件与 \'rhandsontable\' 一起使用？

【英文标题】：How to use the 'afterColumnResize' event with 'rhandsontable'?如何将 'afterColumnResize' 事件与 'rhandsontable' 一起使用？

【发布时间】：2021-04-14 14:26:55

【问题描述】：

javascript 库 Handsontable 有一个事件 afterColumnResize，在手动调整列大小时触发。如何将它与 Shiny 中的 'rhandsontable' 包一起使用？

【参考方案1】：

方法如下：

library(shiny)
library(rhandsontable)
library(htmlwidgets)

jsCode <- c(
  "function(el, x) ",
  "  Handsontable.hooks.add('afterColumnResize', function(index, size)",
  "    Shiny.setInputValue('newsize', index: index+1, size: size);",
  "  );",
  ""
)

ui <- fluidPage(
  rHandsontableOutput("dataTable"),
  br(),
  verbatimTextOutput("sizeinfo")
)

server <- function(input, output, session) 
  df = data.frame(
    company = c('a', 'b', 'c', 'd'),
    bond    = c(0.2, 1, 0.3, 0),
    equity  = c(0.7, 0, 0.5, 1),
    cash    = c(0.1, 0, 0.2, 0),
    stringsAsFactors = FALSE
  )
  output$dataTable <- renderRHandsontable(
    rhandsontable(df, manualColumnResize = TRUE, manualRowResize = TRUE) %>% 
      onRender(jsCode)
  )
  output$sizeinfo <- renderPrint(
    req(input$newsize)
    sprintf(
      "Column %d has new size %dpx.", 
      input$newsize$index, input$newsize$size
    )
  )


shinyApp(ui, server)

【讨论】：

这个解决方案很棒，但是如果您在一页中有两个 rhandsontables 怎么办？那么如何区分两个表之间的更改列？

@Frank 我认为rhandsontable 不可能做到这一点。如果表是用 jQuery 启动的，这将是可能的，但这不是包作者使用的方式。

@Frank Hmm... 在考虑可能有解决方案之后：当调整列大小时，还可以将表 ID 发送到 Shiny 服务器。但是如果还有其他表，则无法仅控制一个表的afterColumnResize事件。

我在想是否有一些 js 代码可以在每次单击表时运行以查询列大小observeEvent(input$dataTable, runjs( <code>)？但是我认为如果多个rhandsontables 在不同的选项卡上，如果我只是在服务器上运行代码之前检查打开了哪个选项卡，上述方法将起作用。