2
我做了一個簡單的例子來說明我的問題，這就是：多個通知閃亮的應用
- 如何在不同的地方獨立對方的設置通知（比方說我想要顯示的每個通知在頂部右側和左側，分別地）
```
library(shiny)
ui <- fluidPage(
# tags$head(
# tags$style(
# HTML(".shiny-notification {
# position: fixed;
# top: 800px;
# left: 40px;
# width: 15em;
# opacity: 1;
# }
# "
# )
# )
#)
actionButton("showme", "Show Notification:")
)
server <- function(input, output, session) {
observe({
showNotification(
id = "welcome_notif",
"Blablablablabla .... blablablabla.",
duration = 20,
closeButton = TRUE,
type = "message")
})
observeEvent(input$showme,{
showNotification(
id = "showme_notif",
"Hihihi", # put text in notification
duration = 30,
closeButton = TRUE,
type = "message")
})
}
shinyApp(ui = ui, server = server)
```
我看到有一個特殊的CSS通知閃亮代碼（https://github.com/rstudio/shiny/blob/master/inst/www/shared/shiny.css）。
如果我更改CSS類（如註釋代碼所示），我只能設法更改所有通知將顯示（但不是獨立）的位置。
編輯：
我試圖用addClass與shinyjs：
library(shiny)
library(shinyjs)
ui <- fluidPage(
useShinyjs(),
inlineCSS(list(.customclass = "position: fixed; top: 200px;")),
actionButton("showme", "Show Notification:")
)
server <- function(input, output, session) {
observe({
showNotification(
id = "welcome_notif",
"Blablablablabla .... blablablabla.",
duration = 20,
closeButton = TRUE,
type = "message")
})
observeEvent(input$showme,{
showNotification(
id = "showme_notif",
"Hihihi", # put text in notification
duration = 30,
closeButton = TRUE,
type = "message")
})
observe({
addClass(id = "showme_notif", class = "customclass")
})
}
shinyApp(ui = ui, server = server)
由弗洛裏安的建議（見下文），但似乎我只能處理在UI生成的元素，而不是在服務器一樣通知。
例如這個工程：
if (interactive()) {
shinyApp(
ui = fluidPage(
useShinyjs(),
inlineCSS(list(.customclass = "position: fixed; top: 200px;")),
p(id = "element", "Watch what happens to me")
),
server = function(input, output) {
observe({
addClass(id = "element", class = "customclass")
})
}
)
}
不幸的是，當我用#welcome_notif替換.shiny-notification時，通知會顯示在默認位置，即右下角。就好像ID沒有處理 – Dav
對不起，我犯了一個錯誤。給出的ID不是HTML的ID。我已經更新了我的答案，我認爲這應該起作用。對困惑感到抱歉。 – Florian
我編輯了我的問題上面。就好像addClass僅適用於UI中的元素，而不適用於服務器中的元素。不過，我不相信因爲閃亮使用了很多服務器生成的元素。因此，我認爲還是有一些缺失 – Dav