I have this Shiny app that displays a large table with reactable. I want to change the appearance so that the selected row gets a different color than the rest of the table. The code below works. However, rowStyle
seem to trigger a re-rendering of the table each time I select a row. Is there a way highlight the row selected without re-rendering the table?
library(shiny)
library(reactable)
library(nycflights13)
library(dplyr)
ui <- fluidPage(
reactableOutput("table"),
verbatimTextOutput("selectedRowsText")
)
server <- function(input, output, session) {
data <- nycflights13::flights |> filter(month == 1)
selected <- reactive(getReactableState("table", "selected"))
output$table <- renderReactable({
reactable(
data,
selection = "multiple",
onClick = "select",
rowStyle = function(index) {
if (index %in% selected()) {
list(backgroundColor = "#c0d6e4", color = "#000")
}
}
)
})
}
shinyApp(ui, server)
Instead, use the reactableTheme to update the styling.
server <- function(input, output, session) {
data <- nycflights13::flights |> filter(month == 1)
selected <- reactive(getReactableState("table", "selected"))
output$table <- renderReactable({
reactable(
data,
selection = "multiple",
onClick = "select",
theme = reactableTheme(
rowSelectedStyle=list(backgroundColor = "#c0d6e4", color = "#000")
)
)
})
}
``