闪亮：更改为另一个选项卡，使当前选项卡变灰

Question

我正在尝试使用 golem 制作一个闪亮的应用程序，但我对此很陌生，并尝试做一些我认为简单的事情，但事实证明并非如此。

在我的 app_ui.R 文件中，我有一个像这样的选项卡结构：

app_ui <- function(request) {
  tagList(
    # Leave this function for adding external resources
    golem_add_external_resources(),
    # Your application UI logic
    fluidPage(
      titlePanel("Debarcoding"),
      tabsetPanel(id = "mainTabset",
        tabPanel(value = "gating", "Gating",
                 htmltools::br(" "),
                 sidebarLayout(
                   sidebarPanel(
                     mod_gating_side_ui("gating_side_ui_1")),
                   mainPanel(
                     mod_gating_scatter_ui("gating_scatter_ui_1")))),
        tabPanel(value = "saving", "Saving",
                 htmltools::br(" "),
                 sidebarLayout(
                   sidebarPanel(
                     mod_saving_side_ui("saving_side_ui_1")),
                   mainPanel(
                     mod_saving_scatter_ui("saving_scatter_ui_1")))))
    )
  )
}

我只希望 gating 选项卡处于活动状态，而 saving 选项卡处于禁用状态。

然后，在 gating 选项卡的 side 部分，我想要一个显示 FINISHED 的按钮，因此当我单击它时，会出现 saving 选项卡gating 一个被禁用。

为此，我在 mod_gating_side.R 文件中尝试了以下操作，但它不起作用...

mod_gating_side_ui <- function(id){
  ns <- NS(id)
  tagList(
    shinyjs::useShinyjs(),
    shinyalert::useShinyalert(),

    actionButton(ns("finish_and_switch"),
                 "Finish gating")
 
  )
}

mod_gating_side_server <- function(id, r){
  moduleServer( id, function(input, output, session){
    ns <- session$ns

    # observer to finish gating and switch to saving tab
    observeEvent(input$finish_and_switch, {
        updateTabsetPanel(session, "mainTabset", "saving")
    })

  })
}

知道怎么做吗？什么是完成我需要的最好方法？它不需要是选项卡，只要有一个页面处于活动状态和一个被禁用，以及一个切换到第二页并禁用第一页的 FINISH 按钮。那可能吗？谢谢！

Answer 1

我将您的代码减少到所需的最小值并修改了的代码以处理 tabsetPanel 而不是 navbarPage。

Please check the following:

library(shiny)
library(shinyjs)

css <- "
.nav li a.disabled {
background-color: #aaa !important;
color: #333 !important;
cursor: not-allowed !important;
border-color: #aaa !important;
}"

ui <- fluidPage(
  fluidPage(
    shinyjs::useShinyjs(),
    shinyjs::inlineCSS(css),
    titlePanel("Debarcoding"),
    tabsetPanel(id = "mainTabset",
                tabPanel(value = "gating", "Gating",
                         htmltools::br(" "),
                         sidebarLayout(
                           sidebarPanel(
                             p("gating_side_ui_1"),
                             actionButton("finish", "FINISH")
                           ),
                           mainPanel(
                             p("gating_scatter_ui_1")
                           ))),
                tabPanel(value = "saving", "Saving",
                         htmltools::br(" "),
                         sidebarLayout(
                           sidebarPanel(
                             p("saving_side_ui_1")
                           ),
                           mainPanel(
                             p("saving_scatter_ui_1")
                           ))))
  )
)

server <- function(input, output, session) {
  
  shinyjs::disable(selector = '.nav-tabs a[data-value="saving"')
  
  observeEvent(input$finish, {
    updateTabsetPanel(
      inputId = "mainTabset",
      selected = "saving"
    )
    shinyjs::enable(selector = '.nav-tabs a[data-value="saving"')
    shinyjs::disable(selector = '.nav-tabs a[data-value="gating"')
  })
}

shinyApp(ui, server)

闪亮：更改为另一个选项卡，使当前选项卡变灰

Shiny: change to another tab greying out the current

tabs

r

shiny

golem