我在下面有一个闪亮的应用程序,其中包括 tabItems。我希望在第一次启动应用程序时显示一个动作按钮,该按钮将超出 tabItems 内容。然后当我按下它时,我将被移动到 Consent tabItem。这个按钮从那以后就没有用了,它应该消失,因为将显示 tabItems 的内容。我还希望用户能够在按下 Consent
按钮之前按下 "Get Started"
按钮,并且仍然能够移动到 Consent
tabItem。
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(shinyjs)
mytitle <- paste0("")
dbHeader <- dashboardHeaderPlus(
titleWidth = "0px",
tags$li(a(
div(style="display: inline;margin-top:-35px; padding: 0px 90px 0px 1250px ;font-size: 44px ;color:#001641;font-family:Chronicle Display Light; width: 500px;",HTML(mytitle)),
div(style="display: inline;padding: 0px 0px 0px 0px;vertical-align:top; width: 150px;", actionButton("conse", "Consent",
style=" background-color: #faf0e6; border-color: #faf0e6") ),
), class = "dropdown")
)
shinyApp(
ui = dashboardPagePlus(
header = dbHeader,
sidebar = dashboardSidebar(width = "0px",
sidebarMenu(id = "sidebar", # id important for updateTabItems
menuItem("Consent", tabName = "conse", icon = icon("line-chart"))
) ),
body = dashboardBody(
tags$head(tags$style(HTML('
'))),
useShinyjs(),
tags$script(HTML("$('body').addClass('fixed');")),
tags$head(tags$style(".skin-blue .main-header .logo { padding: 0px;}")),
actionButton("button", "Get started",style='padding:4px; font-size:140%'),
tabItems(
tabItem("conse", textInput("pos", label = ("Position"), value = "") )
)
)
),
server<-shinyServer(function(input, output,session) {
hide(selector = "body > div > header > nav > a")
shinyjs::hide("conse")
shinyjs::hide("pos")
observeEvent(input$button, {
shinyjs::show("conse")
shinyjs::show("pos")
updateTabItems(session, "sidebar",
selected = "conse")
shinyjs::hide("button")
})
}
)
)
答案 0 :(得分:1)
一种方法是使用 shinyjs
隐藏 tabItem 中的元素。相关代码如下。
shinyApp(
ui = dashboardPagePlus(
header = dbHeader,
sidebar = dashboardSidebar(width = "0px",
sidebarMenu(id = "sidebar", # id important for updateTabItems
menuItem("Consent", tabName = "conse", icon = icon("line-chart"))
)
),
body = dashboardBody(
useShinyjs(),
tags$script(HTML("$('body').addClass('fixed');")),
tags$head(tags$style(".skin-blue .main-header .logo { padding: 0px;}")),
actionButton("button", "Get started", style='padding:4px; font-size:140%'),
tabItems(
tabItem("conse", textInput("pos", label = ("Position"), value = "")
)
)
)
),
server<-shinyServer(function(input, output,session) {
hide(selector = "body > div > header > nav > a")
shinyjs::hide("pos")
observeEvent(input$button, {
shinyjs::show("pos")
updateTabItems(session, "sidebar", selected = "conse")
shinyjs::hide("button")
})
observeEvent(input$conse, {
shinyjs::show("pos")
updateTabItems(session, "sidebar", selected = "conse")
shinyjs::hide("button")
})
}
)
)
另一种方法是使用 conditionalPanel
隐藏选项卡中的所有项目。根据您的用例,这可能是更好的选择。
shinyApp(
ui = dashboardPagePlus(
header = dbHeader,
sidebar = dashboardSidebar(width = "0px",
sidebarMenu(id = "sidebar", # id important for updateTabItems
menuItem("Consent", tabName = "conse", icon = icon("line-chart"))
)
),
body = dashboardBody(
useShinyjs(),
tags$script(HTML("$('body').addClass('fixed');")),
tags$head(tags$style(".skin-blue .main-header .logo { padding: 0px;}")),
actionButton("button", "Get started", style='padding:4px; font-size:140%'),
tabItems(
tabItem("conse",
conditionalPanel(condition = "input.conse >0 || input.button>0",
textInput("pos", label = ("Position"), value = "")
)
)
)
)
),
server<-shinyServer(function(input, output,session) {
hide(selector = "body > div > header > nav > a")
observeEvent(input$button, {
updateTabItems(session, "sidebar", selected = "conse")
shinyjs::hide("button")
})
observeEvent(input$conse, {
updateTabItems(session, "sidebar", selected = "conse")
shinyjs::hide("button")
})
}
)
)