【问题标题】:shinydashboard header dropdown add group linksshinydashboard 标题下拉列表添加组链接
【发布时间】:2017-09-04 07:03:26
【问题描述】:

我想在标题面板的下拉菜单中放置多个链接,但现在我只能通过 tags$li 使用平面水平布局创建它,而我想要一个垂直分组下拉菜单。

一个最小的可重复代码如下,我的意思是我想把linkA和linkB放在grouplinkAB下,用户可以在新窗口中打开其中一个。可以通过代码中的dropdownMenu(type='notifications',...)来实现,但是我不知道“grouplinkAB”的组名放在哪里,点击时无法打开新窗口链接,我也必须隐藏文本“你有 2 个通知”,所以我想用 tags$li 和 tags$ul 来实现它,但我对 HTML 知之甚少,任何帮助将不胜感激。

library(shinydashboard)
library(shiny)

runApp(
  shinyApp(
    ui = shinyUI(
      dashboardPage(
        dashboardHeader(title='Reporting Dashboard',
                        tags$li(class="dropdown",tags$a("grouplinkAB",href="http://stackoverflow.com/", target="_blank")),
                        tags$li(class="dropdown",tags$a("linkA",href="http://stackoverflow.com/", target="_blank")),
                        tags$li(class="dropdown",tags$a("linkB",href="http://stackoverflow.com/", target="_blank")),
                        dropdownMenu(type='notifications',
                                     notificationItem(text='linkA',href="http://stackoverflow.com/"),
                                     notificationItem(text='linkB',href="http://stackoverflow.com/")
                                     )
        ),
        dashboardSidebar(),
        dashboardBody()
      )
    ), 
    server = function(input, output){}
  ), launch.browser = TRUE
)

【问题讨论】:

    标签: html css r shiny shinydashboard


    【解决方案1】:

    好的,大约一年前我看到了一个类似的请求,但没有深入了解。这一次我试图让你的代码工作但不能然后我查看dropdownMenu 代码,发现它根本没有设置来处理这个,但可以修改为相当容易。

    我选择不这样做,而是创建了一个新版本的dropdownMenu 专门用于执行此操作。

    代码如下:

    library(shinydashboard)
    
    dropdownHack <- function (...,badgeStatus = NULL, .list = NULL,menuname=NULL) 
    {
      if (!is.null(badgeStatus)){
        shinydashboard:::validateStatus(badgeStatus)
      }
      items <- c(list(...), .list)
      lapply(items, shinydashboard:::tagAssert, type = "li")
      dropdownClass <- paste0("dropdown ", "text-menu")
      numItems <- length(items)
      if (is.null(badgeStatus)) {
        badge <- NULL
      }
      else {
        badge <- span(class = paste0("label label-", badgeStatus), numItems)
      }
      tags$li(class = dropdownClass, a( href="#", class="dropdown-toggle", 
                                        `data-toggle`="dropdown", menuname, badge),
              tags$ul(class = "dropdown-menu",  items  )
      )
    }
    
    menuitemHack <- function(text,href){
      notificationItem(text=text,href=href,icon=shiny::icon("rocket") )
    }
    
    runApp(
      shinyApp(
        ui = shinyUI(
          dashboardPage(
            dashboardHeader(title='Reporting Dashboard',
                            dropdownHack(menuname="GroupAB",
                                         menuitemHack(text='linkA',href="http://stackoverflow.com/"),
                                         menuitemHack(text='linkB',href="http://stackoverflow.com/")
                            ),
                            dropdownMenu(type='notifications',
                                       notificationItem(text='linkA',href="http://stackoverflow.com/"),
                                       notificationItem(text='linkB',href="http://stackoverflow.com/")
                            )
            ),
            dashboardSidebar(),
            dashboardBody()
          )
        ), 
        server = function(input, output){}
      ), launch.browser = TRUE
    )
    

    结果如下:

    注意事项:

    • 它需要一个图标,你可以选择任何 fontAwesome 或 Glyphicons,如果你什么都不想的话,那里可能有一个空白。
    • 我想如果 ShinyDashboard 结构发生很大变化,它会崩溃,所以请记住这一点。
    • 也许下一个版本也将支持此选项,只是几行额外的代码。

    【讨论】:

    • 太棒了!它按预期工作,非常感谢。现在下拉菜单的默认设置太宽了,链接无法在新窗口中打开。我会搜索一些关于它的设置。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-10-24
    • 2015-10-05
    • 2010-09-30
    • 1970-01-01
    • 2012-06-08
    • 2021-12-17
    • 1970-01-01
    相关资源
    最近更新 更多