闪亮的：按下actionButton后应用闪亮的客户加载器

Question

背景

我有一个应用程序，用户从下拉菜单 (selectizeInput) 中选择一个文件名，然后使用 actionButton 确认选择。该应用程序将以DT::dataTableOutput 格式显示结果。

目标

我希望能够显示加载屏幕（使用 shinydashboardloader 包），但仅在用户按下 actionButton 之后。在此之前，我想显示一个空屏幕。此外，如果用户想在一个会话中尝试多个文件，则每次按下 actionButton 时都会出现加载屏幕，并在加载数据集时消失。

当前状态

目前，如果我运行这个应用程序，加载按钮会一直出现，在用户选择文件之前也是如此

### ui.R
library(shiny)
library(shinydashboard)
library(DT)
library(shinycustomloader)

dashboardPage(
  dashboardHeader(),
  dashboardSidebar(

selectizeInput("file", "Select File",
               c("fileA", "fileB")), 

actionButton("submit", "Submit")
  ),
  dashboardBody(
    fluidRow(
      box(h2("My Data"),
      div(style = 'overflow-x: scroll', 
          withLoader(DT::dataTableOutput('mytable'),
                     type = "html",
                     loader = "loader1")),
      width = 12)

  )
  )
)


#### server.R
library(shiny)
library(shinydashboard)
library(DT)


shinyServer(function(input, output, session) {  

  file_name <- reactive({ 
req(input$file)
  })


  # When the Submit button is clicked, start the cleaning and matching 
  observeEvent(input$submit, {

## open chosen file 
#    open_file <- read_excel(paste0("input_files/", file_name()))

### + some processing that gives me matched_df

matched_df <- data.frame(A = c(1, 2, 3, 4),
                         B = c("A", "B", "C", "D"))

selected <- reactive({

  matched_df # + apply some filter

}) 



output$mytable = DT::renderDataTable({
  selected()
})


  })

})

我猜测前进的方向是使用conditionalPanel，但我不确定如何点击actionButton 条件。

更新

我将conditionalPanel 应用于数据表，但它仅在我第一次按下“提交”按钮时才有效。如果在同一会话中更改文件名并再次按下按钮，加载程序将不会出现。有什么想法可以让它在一个会话中多次工作吗？

  dashboardBody(
     fluidRow(
      box(h2("My Data"),
          conditionalPanel("input.submit==1",
          div(style = 'overflow-x: scroll', 
              withLoader(DT::dataTableOutput('mytable'),
                     type = "html",
                     loader = "loader1"))
      ),
      width = 12)

任何帮助都会很棒，谢谢！

Answer 1

1：我不熟悉shinydashboardloader，但我可以通过使用shinyjs 包向我的应用程序添加加载指示器，以使用CSS 隐藏和显示元素。我会将您的加载页面元素添加到您的主页并将它们包装在 shinyjs::hidden 函数中，因此默认情况下它们是隐藏的。然后，当用户单击操作按钮时，调用shinyjs::showElement 显示它们，调用shinyjs::hideElement 在加载完成后隐藏它们。

用户界面：

shinyjs::hidden(div(id = 'loading',
           # PUT LOADING ELEMENTS HERE))

服务器：

observeEvent(input$submit, {
    # Show element once submit button is pressed
    shinyjs::showElement(id = 'loading')

    # CODE TO MAKE DATA FRAME

    # Hide loading element when done
    shinyjs::hideElement(id = 'loading')
)

2：至于您的编辑问题，您的条件面板仅显示第一次的原因是actionButton 的值每次单击都会增加一个。所以第一次点击它时，它会从 0 变为 1；如果再次单击它，它会从 1 变为 2，依此类推。由于您将条件设置为input$select == 1，因此它只会在按钮被点击1次时才会出现。

要让它做你想做的事，你要么需要将条件更改为input$select > 1，这样只要按钮被点击一次，它就会出现，或者添加一个reactiveValue，当单击按钮，然后在满足另一个条件时重置为 0（例如加载完成时）。

rv <- reactiveValues(loading = 0)

# When you click submit, show the loading screen
observeEvent(input$submit, {rv$loading <- 1})

# When you click LOAD, start loading, then hide the loading screen when finished
observeEvent(input$LOAD, {

    # CODE TO LOAD AND GENERATE DATA HERE

    rv$loading <- 0})