Question

我需要在一个闪亮的应用程序中将CSS类添加到一系列textOutput中。

当我尝试时，例如：

textOutput('text', class = 'error')

我得到：

Warning: Error in textOutput: unused argument (class = "error")

可以更改该textOutput的ID的CSS。但是，我的ID是动态生成的，所以这不是一个好的解决方案。一种可能的选择是“抓取”所有以“ error”开头/包含“ error”的ID（例如“ error1”，“ error2”），但我不确定在CSS样式表中是否可以实现。

Answer 1

一个简单的方法就是使用闪亮的tagAppendAttributes函数。通常，我发现将闪亮的输出对象的HTML输出通过管道传输到其中像这样更容易：

library(shiny)
library(magrittr)

textOutput("foo") %>% 
  tagAppendAttributes(class = 'error')

将产生以下输出，其中包含错误类。

<div class="shiny-text-output error" id="foo"></div>

您也可以使用样式执行相同的操作

textOutput("foo") %>% 
  tagAppendAttributes(style= 'color:green;')

<div id="foo" class="shiny-text-output" style="color:green;"></div>

Answer 2

也许将其包装在具有所需类的div中有帮助吗？：

library(shiny)

ui <- fluidPage(tags$div(id = 'wrap_div',
                         class = 'error',
                         textOutput('text')))

server <- function(input, output, session) {
  output$text <- renderText ({
    "My text"
  })
}

shinyApp(ui = ui, server = server)

Answer 3

各种*Output函数返回具有可操纵属性的对象，其中class –仅使用str()函数检查其 str 结构：< / p>

foo <- textOutput("foo")
print(foo)
# <div id="foo" class="shiny-text-output"></div>
str(foo)
# List of 3
#  $ name    : chr "div"
#  $ attribs :List of 2
#   ..$ id   : chr "foo"
#   ..$ class: chr "shiny-text-output"
#  $ children: list()
#  - attr(*, "class")= chr "shiny.tag"

这意味着我们可以像这样覆盖由class函数设置的textOutput：

foo$attribs$class <- "foo bar"
print(foo)
# <div id="foo" class="foo bar"></div>

如果要在添加新类的同时保留现有类，则可以使用paste()函数，并将其包装在自定义add_classes()函数中以方便使用：

add_classes <- function(el, classes) {
  el$attribs$class <- paste(el$attribs$class, classes)
  el
}

foo <- add_classes(foo, "baz qux")
print(foo)
# <div id="foo" class="foo bar baz qux"></div>

Answer 4

答案是使用CSS选择器，例如：

[id^="error"] {
   ...
}

此文件放置在应用程序目录中的外部CSS文件中，通常命名为style.css。

将CSS类添加到闪亮的textOutput

4 个答案: