时间戳

首页 > 解决方案 > 在R Shiny中，第一次调用App时如何消除observeEvent条件的闪烁？

r - 在R Shiny中，第一次调用App时如何消除observeEvent条件的闪烁？

问题描述

在下面的 MWE 代码中，input2用户可以通过单击 Input 2 的“显示”单选按钮来选择调用该对象。默认设置是隐藏input2。但是，第一次调用应用程序时，input2会快速闪烁，然后被observeEvent.

这种闪烁在代码的非 MWE 版本中更为明显。

有一篇相关的帖子在 R Shiny 中，如何在不使用 renderUI 的情况下首次调用 App 时消除侧边栏中所有条件面板的闪烁？解决了这个问题conditionalPanel。但是这里没有conditionalPanel。

我不想renderUI用来解决这个问题！！由于renderUI有缺点，我不想重新介绍。

MWE代码：

library(shiny)
library(shinyjs)

f <- function(action,i){as.character(checkboxInput(paste0(action,i),label=NULL))}
actions       <- c("show", "reset")
tbl           <- t(outer(actions, c(1,2), FUN = Vectorize(f)))
colnames(tbl) <- c("Show", "Reset")
rownames(tbl) <- c("Input 2", "Input 3")

ui <- fluidPage(
  useShinyjs(),
  tags$head(
    tags$style(HTML(
      "td .checkbox {margin-top: 0; margin-bottom: 0;}
       td .form-group {margin-bottom: 0;}"
    ))
  ),
  br(),
  sidebarLayout(
    sidebarPanel(
      numericInput("input1", "Input 1:", 10, min = 1, max = 100),
      h5(strong("Add inputs:")),
      tableOutput("checkboxes"),
      numericInput("input2", "Input 2:", 10, min = 1, max = 100),
    ),
    mainPanel()
  )    
)

server <- function(input, output, session){
  
  output[["checkboxes"]] <- 
    renderTable({tbl}, 
                rownames = TRUE, align = "c",
                sanitize.text.function = function(x) x
    )

  observeEvent(input[["show1"]], {
    if(input[["show1"]] %% 2 == 1){shinyjs::show(id = "input2")} else
      {shinyjs::hide(id = "input2")}
  })

}

shinyApp(ui, server)

标签： rshinyshiny-reactivityshinyjs

解决方案

在事件循环中需要一些时间，直到observerEvent第一次被调用。默认情况下，它将显示在最开始。这导致闪光。只需在函数input2的最开始隐藏：server

server <- function(input, output, session) {
  # Avoid flashing
  shinyjs::hide(id = "input2")
  
  output[["checkboxes"]] <-
    renderTable(
      {
        tbl
      },
      rownames = TRUE,
      align = "c",
      sanitize.text.function = function(x) x
    )

  observeEvent(input[["show1"]], {
    if (input[["show1"]] %% 2 == 1) {
      shinyjs::show(id = "input2")
    } else {
      shinyjs::hide(id = "input2")
    }
  })
}

推荐阅读