从闪亮的反应输出修改 CSS [重复]

Question

我在 Shiny 中有一个 navbarPage，我在其中初始化了一个使用 css 隐藏的选项卡（我们称之为 tab1）。为此，我使用以下行：

    tags$head(tags$style(HTML("#tabs li a[data-value = 'tab1'] {display: none;}"))),

效果完美。

现在，在服务器中，我想显示该选项卡以响应事件，但我不知道如何从 R 代码“更新/替换”该 css 属性（显示：无）。我看到用 runjs() 可以做到，但我并不是真正的 js/css 专家。

如何在服务器中修改该对象的 css 属性？

Answer 1

更新

我想我成功了。 我的做法是：一开始就定义两个css样式。 display: none 用于初始 tab2 导航栏 tabsetpanel，display: inline-block !important 用于名为“showtab”的新类。然后我使用shinyjs向导航栏tabsetpanel的tab2添加一个类，它覆盖（!important）tab2的原始css样式。

shinyjs 原始函数的问题是： (1) 当使用hide/show 时，您可以在初始启动时看到不希望它出现的tab2。 (2) 当使用你的 css 样式 display: none 和 shinyjs::show 或 shinyjqui::jqui_show 时，样式参数会更改为 style = inline，这会弄乱导航栏页面中单词“tab2”的位置。

css <- "
#navbar li a[data-value = tab2] {
display: none;
}
.showtab {
display: inline-block !important;
}
"

# 

library(shiny)
library(shinyjs)

ui <- tagList(

  useShinyjs(),
  inlineCSS(css),

  navbarPage(
    "test navbarPage",
    id = "navbar",
    tabPanel(
      title = "tab1",
      actionButton("show", "Show tab2")
    ),

    tabPanel(
      title = "tab2"
    )
  )
)

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

  observeEvent(input$show, {
    addClass(selector = "#navbar li a[data-value = tab2]",
                   class = 'showtab')
  })
}



shinyApp(ui = ui, server = server)