1

我需要阻止用户访问其他选项卡，直到完成某些操作。在这个可重现的示例中，我想阻止用户访问，Tab 2直到他按下按钮。

这是应用程序的外观：

在此处输入图像描述

这是应用程序的代码：

library(shiny)

ui <- shinyUI(navbarPage("",
                         tabPanel(h1("Tab1"), value = "nav1",
                                  mainPanel(
                                            br(),
                                            h2("The user must press this button to access the other tab."),
                                            br(),
                                            shiny::actionButton('button', 'press the button')
                                  )
                         ),
                         tabPanel(h1("Tab2"),
                                  value = "nav2",

                                  h3('Block access until user presses button')
                         )
)
)

server <- shinyServer(function(input, output) {


})

# Run the application
shinyApp(ui = ui, server = server)

我希望用户能够看到 Tab2 存在，但在他们按下按钮之前使其无法点击。

有任何想法吗？

4

3 回答 3

1
  1. 不需要使用任何服务器端处理。现代 Web 应用程序开发概念之一是前端和后端分离。如果你可以在前端完成，那么不要使用服务器来完成这项工作。
  2. conditionalPanel是一个更好的解决方案，但用户仍然可以单击选项卡按钮，只需给他们一个空白页面。

这是一个更好的解决方案，让我们使用一些 js 来禁用选项卡按钮，除非用户单击操作按钮。用户可以看到选项卡按钮，但它在开始时是灰色且不可点击的：

library(shiny)

ui <- shinyUI(navbarPage(
  "",
  tabPanel(
    h1("Tab1"), 
    value = "nav1",
    mainPanel(
      br(),
      h2("The user must press this button to access the other tab."),
      br(),
      shiny::actionButton('button', 'press the button', onclick = "$(tab).removeClass('disabled')")
    )
  ),
  tabPanel(
    h1("Tab2"),
    value = "nav2",
    uiOutput("tab2contents")
  ),
  tags$script(
    '
    var tab = $(\'a[data-value="nav2"]\').parent().addClass("disabled");
    $(function(){
      $(tab.parent()).on("click", "li.disabled", function(e) {
        e.preventDefault();
        return false;
      });
    });
    '
  )
))    

server <- shinyServer(function(input, output) {

})

# Run the application
shinyApp(ui = ui, server = server)

在此处输入图像描述

于 2021-10-30T22:32:08.277 回答
0

使用conditionalPanel(). 健康）状况？该按钮不应该有零点击。

您的示例现在变为：

library(shiny)

ui <- shinyUI(
  navbarPage(
    title = "", 
    
    tabPanel(
      title = h1("Tab1"), 
      value = "nav1",
      
      mainPanel(
        br(),
        h2("The user must press this button to access the other tab."),
        br(),
        shiny::actionButton('button', 'press the button')
      )
    ), 
    
    tabPanel(
      h1("Tab2"),
      value = "nav2",
      
      # ----conditional panel here----
      conditionalPanel(
        condition = "input.button != 0", 
        
        h3('Block access until user presses button')
      )
    )
  )
)

server <- shinyServer(function(input, output) {
  
  
})

# Run the application
shinyApp(ui = ui, server = server)
于 2021-10-29T17:00:32.530 回答
0

在我上面的评论中添加细节：

library(shiny)

ui <- shinyUI(navbarPage("",
        tabPanel(
          h1("Tab1"), 
          value = "nav1",
          mainPanel(
            br(),
            h2("The user must press this button to access the other tab."),
            br(),
            shiny::actionButton('button', 'press the button')
          )
        ),
        tabPanel(
          h1("Tab2"),
          value = "nav2",
          uiOutput("tab2contents")
        )
      )
    )    

server <- shinyServer(function(input, output) {
   v <- reactiveValues(tab2Active=FALSE)
   
  observeEvent(input$button, { v$tab2Active <- TRUE})

  output$tab2contents <- renderUI({
    if (v$tab2Active) {
      h3('Tab 2 is active')
    } else {
      h3('Block access until user presses button')
    }
  })
})

# Run the application
shinyApp(ui = ui, server = server)
于 2021-10-29T10:37:23.220 回答