首页 > 解决方案 > tags$img 未更新以在 UI 中显示图像

问题描述

我创建了一个上传图像并显示它的应用程序,但注意到它不再正常工作。上传第二张图片时,UI 不会刷新,只显示原始图片。似乎它tags$img的行为与以前不同。该应用程序的想法是用户能够上传图像,确认它是正确的,然后对图像做一些事情。用户上传新图像并仍然显示以前的图像是没有意义的。

我注意到,当我使用tags$iframe它时,它按预期工作,也就是说,当上传第二张图片时,第二张图片会显示在应用程序中。我注意到如果我使用tags$iframetags$img显示相同的项目,它会按预期工作,显示上传的第二个项目。

此示例仅使用tags$img,如果您上传图像,则显示它,当您上传第二张图像时,仅显示第一张图像。UI 似乎没有更新以显示第二张图像。

library(shiny)

options(shiny.maxRequestSize=12*1024^2)

ui <- fluidPage(  
  sidebarLayout(
    sidebarPanel(
      uiOutput("ui_file_input")
    ),
    mainPanel(
      uiOutput("ui_upload")
    )
  )
)


server <- function(input, output) {
  
  rv <- reactiveValues(
    upload_state = NULL,
    img = NULL
  )
  
  output$ui_file_input <- renderUI({
    fileInput("upload",
              label = NULL,
              accept = c(".jpg", ".jpeg")
    )
  })
  
  observeEvent(input$upload, {
    rv$upload_state <- "upload"
  })

  observe({
    req(rv$upload_state)
    test_file <- readBin(con = input$upload$datapath, what = "raw", n = input$upload$size)
    writeBin(test_file, "www/fieldphoto.jpeg")
    addResourcePath("www", "www")
  })
  
  output$ui_upload <- renderUI({
    req(input$upload)
    tags$img(src = "www/fieldphoto.jpeg", width = "300px")
  })

}

shinyApp(ui = ui, server = server)

当我添加链接到tags$iframe它的第二个输出时,它的行为符合预期。上传图像并正常显示,当上传第二张图像时,它会更新以在tags$imgtags$iframe输出中显示第二张图像。

library(shiny)

options(shiny.maxRequestSize=12*1024^2)

ui <- fluidPage(
  
  sidebarLayout(
    
    sidebarPanel(
      uiOutput("ui_file_input")
    ),
    
    mainPanel(
      uiOutput("ui_upload"),
      uiOutput("ui_upload2")
    )
  )
)


server <- function(input, output) {
  
  rv <- reactiveValues(
    upload_state = NULL,
    img = NULL
  )
  
  output$ui_file_input <- renderUI({
    fileInput("upload",
              label = NULL,
              accept = c(".jpg", ".jpeg")
    )
  })
  
  observeEvent(input$upload, {
    rv$upload_state <- "upload"
  })

  observe({
    req(rv$upload_state)
    test_file <- readBin(
      con = input$upload$datapath, what = "raw", n = input$upload$size
    )
    writeBin(test_file, "www/fieldphoto.jpeg")
    addResourcePath("www", "www")
  })
  
  
  # this displays the uploaded card
  output$ui_upload <- renderUI({
    req(input$upload)
    tags$img(src = "www/fieldphoto.jpeg", width = "300px")
  })
  
  
  output$ui_upload2 <- renderUI({
    req(input$upload)
    tags$iframe(src = "www/fieldphoto.jpeg", width = "300px")
  })

}

shinyApp(ui = ui, server = server)

这在过去按预期工作,不确定确切的时间表,但我认为最近几个月的某个时候。上面的例子是一个简单的代表,因为问题是一个更大的 Shiny 应用程序的一部分。我不明白为什么tags$iframe会导致 UI 更新但没有tags$img。正确的文件出现在 www 文件夹中。显示的内容似乎有问题。

标签: htmlrimageshiny

解决方案


推荐阅读