闪亮的应用程序:如何在多次数据输入/一系列单选按钮输入后返回一步/返回(使用后退按钮)

问题描述 投票:0回答:1

我写了一个闪亮的应用程序,可以向用户显示不同的单选按钮。根据输入,数字将添加到

score/counter
和其他单选按钮将弹出(和前一个将被禁用)。

我现在想知道,我如何实现一个“后退”按钮,让用户后退一步(例如,在误点击的情况下)这意味着:

  1. 隐藏最近的单选按钮
  2. 再次激活最后一个单选按钮
  3. 调整
    score/counter

我学会了如何添加一个调用

session$reload()
的“重置”按钮,它会删除所有内容,用户可以重新开始。但是,如果用户可以返回一步就更好了。

我发现了类似的问题(Create general purpose “go back” button in shiny and https://www.collinberke.com/blog/posts/2021-09-12-shiny-implementing-a-next-and-后退按钮/index.html),但是,这些问题处理的设置略有不同。

例子:

ui.R

ui <- fluidPage(
  
  shinyjs::useShinyjs(),
  # Add an invisible counter to store the total score
  verbatimTextOutput(outputId = "counter", placeholder = TRUE),
  
  # Add a radio button with two choices
  radioButtons(inputId = "a",
               # label = "a",
               label = "a",
               choices = c("10", "5"),
               selected = ""),
  
  
  # UI elements for the b and c radio buttons
  uiOutput("b"),
  uiOutput("c"),
  uiOutput("d"),
  uiOutput("c1"),
  uiOutput("e"),
  uiOutput("f"),
  
  # Add a back button to allow the user to go back to the previous question
  actionButton(
    inputId = "reset_button",
    label = "Reset",
    width = "50%"
  ),
  textOutput("reset_val")
  
)

服务器.R

server <- function(input, output, session) {
  
  reset_rv <- reactiveVal(value = 0L)
  
  
  
  # Initialize the counter to 0
  counter <- reactiveValues(value = 0)
  
  # Track the selected options
  selected_options <- reactiveValues(
    a = NULL,
    b = NULL,
    d = NULL,
    c = NULL,
    e = NULL,
    f = NULL
  )
  
  # Update the counter when the a radio button is clicked
  observeEvent(input$a, {
    if (!is.null(input$a)) {
      selected_options$a <- input$a
      if (input$a == "5") {
        counter$value <- counter$value + 0
        output$b <- renderUI({
          radioButtons(inputId = "b",
                       label = "b",
                       choices = c("a", "10"),
                       selected = "")
        })
        
      } else if (input$a == "10") {
        counter$value <- counter$value + 8
        output$c <- renderUI({
          radioButtons(inputId = "c",
                       label = "c",
                       choices = c("L", "R"),
                       selected = "")
        })
    
        
        }}
    shinyjs::disable("a")
    })

  

# 2 -----------------------------------------------------------------------

  observeEvent(input$b, { 
    if (!is.null(input$b)) {
      selected_options$b <- input$b
      if (input$b == "5") {
        counter$value <- counter$value + 0
        output$d <- renderUI({
          radioButtons(inputId = "d",
                       label = "d",
                       choices = c("5", "10"),
                       selected = "")
        })
      } else if (input$b == "10") {
        counter$value <- counter$value + 6
        output$c1 <- renderUI({
          radioButtons(inputId = "c1",
                       label = "c",
                       choices = c("L", "R"),
                       selected = "")})}}
    shinyjs::disable("a")
    shinyjs::disable("b")
    })
  
    
  
  observeEvent(input$c, {
    if (!is.null(input$c)) {
      selected_options$c <- input$c
      if (input$c == "R") {
        counter$value <- counter$value + 0
        output$e <- renderUI({
          radioButtons(inputId = "e",
                       label = "e",
                       choices = c("5", "10"),
                       selected = "")
        })
      } else if (input$c == "L") {
        counter$value <- counter$value + 4
        output$f <- renderUI({
          radioButtons(inputId = "f",
                       label = "L",
                       choices = c("5", "10"),
                       selected = "")})}}
    
    shinyjs::disable("a")
    shinyjs::disable("c")
    })    
  
  
  
  # Update the counter output
  output$counter <- renderText({
    paste("Score:", counter$value)
  })
  
  observeEvent(input$reset_button, {
    reset_rv(input$reset_button)
    session$reload()
  })
  

  
}



 
  

奔跑

shinyApp(ui = ui, server = server)
r shiny shinyapps shinyjs
1个回答
1
投票

我建议(几乎总是)放弃

renderUI
并使用更新XXX函数(
updateRadioButtons
)代替,因为重新渲染元素比更新现有元素慢。

此外,您可以利用

radioButtons
'
choiceNames
/
choiceValues
构造来避免冗长的 if 子句。

隐藏我正在使用的元素

conditionalPanels

library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),
  verbatimTextOutput(outputId = "counter_text", placeholder = TRUE),
  radioButtons(inputId = "a",
               label = "a",
               selected = "",
               choiceNames  = c("10", "5"),
               choiceValues = c(8L, 0L)),
  conditionalPanel("input.a == 0", style = "display: none;",
                   radioButtons(inputId = "b",
                                label = "b",
                                selected = "",
                                choiceNames  = c("a", "10"),
                                choiceValues = c(0L, 6L))),
  conditionalPanel("input.a == 8", style = "display: none;",
                   radioButtons(inputId = "c",
                                label = "c",
                                selected = "",
                                choiceNames  = c("L", "R"),
                                choiceValues = c(4L, 0L))),
  conditionalPanel("input.b == 6", style = "display: none;",
                   radioButtons(inputId = "c1",
                                label = "c",
                                selected = "",
                                choiceNames = c("L", "R"),
                                choiceValues = c(0L, 0L))),
  conditionalPanel("input.b == 0", style = "display: none;",
                   radioButtons(inputId = "d",
                                label = "d",
                                selected = "",
                                choiceNames = c("5", "10"),
                                choiceValues = c(0L, 0L))),
  conditionalPanel("input.c == 0", style = "display: none;",
                   radioButtons(inputId = "e",
                                label = "e",
                                selected = "",
                                choiceNames = c("5", "10"),
                                choiceValues = c(0L, 0L))),
  conditionalPanel("input.c == 4", style = "display: none;",
                   radioButtons(inputId = "f",
                                label = "L",
                                selected = "",
                                choiceNames = c("5", "10"),
                                choiceValues = c(0L, 0L))),
  actionButton(
    inputId = "undo_button",
    label = "Undo",
    width = "25%",
    icon = icon("rotate-left")
  ),
  actionButton(
    inputId = "reset_button",
    label = "Reset",
    width = "25%",
    icon = icon("xmark")
  ),
  textOutput("reset_val")
  
)

server <- function(input, output, session) {
  radioButtonIds <- list("a", "b", "c", "c1", "d", "e", "f")
  counter <- reactive({
    lapply(radioButtonIds, function(inputId){if(isTruthy(input[[inputId]])){disable(inputId)}})
    sum(unlist(lapply(radioButtonIds, function(inputId){as.integer(input[[inputId]])})))
  })
  observeEvent(input$undo_button, {
    if(isTruthy(input$c1) || isTruthy(input$d) || isTruthy(input$e) || isTruthy(input$f)){
      lapply(list("c1", "d", "e", "f"), function(inputId){
        updateRadioButtons(session, inputId, selected = character(0))
        enable(inputId)
      })
    } else if(isTruthy(input$b) || isTruthy(input$c)){
      lapply(list("b", "c"), function(inputId){
        updateRadioButtons(session, inputId, selected = character(0))
        enable(inputId)
      })
    } else if(isTruthy(input$a)){
      updateRadioButtons(session, inputId = "a", selected = character(0))
      enable("a")
    }
  })
  observeEvent(input$reset_button, {
    lapply(radioButtonIds, function(inputId){
      updateRadioButtons(session, inputId, selected = character(0))
      enable(inputId)
    })
  })
  output$counter_text <- renderText({
    paste("Score:", counter())
  })
}

shinyApp(ui = ui, server = server)

PS:在这种情况下,您可能需要检查图书馆(shinyglide)。

© www.soinside.com 2019 - 2024. All rights reserved.