简体   繁体   English

链接到闪亮应用程序的选项卡或面板

[英]Linking to a tab or panel of a shiny app

How do I manage to link from a given shiny part to parts that are located on other tabs/panels?我如何设法从给定的闪亮部件链接到位于其他选项卡/面板上的部件?

Update更新

The solution I drafted below works for the explicit case of linking to tabs/panels (and that's what I asked for).我在下面起草的解决方案适用于链接到选项卡/面板的明确情况(这就是我所要求的)。

However, I'd be interested to also know about more generic ways of linking parts of a shiny app.但是,我也有兴趣了解链接闪亮应用程序部分的更通用方法。

Example例子

I'd like to link from panel A to panel B, but I'm not quite sure what I need to specify as an action when the action link in panel A is clicked.我想从面板 A 链接到面板 B,但我不太确定单击面板 A 中的操作链接时需要将什么指定为操作。

The value #tab-4527-2 came from investigating the HTML output of ui , but I just saw that those values change each time I restart the app.#tab-4527-2来自调查ui的 HTML 输出,但我只是看到每次重新启动应用程序时这些值都会发生变化。

library(shiny)

# UI ---------------------------------------------------------------------

ui <- fluidPage(
  tabsetPanel(
    tabPanel(
      "A",
      p(),
      actionLink("link_to_tabpanel_b", "Link to panel B")
    ),
    tabPanel(
      "B",
      h3("Some information"),
      tags$li("Item 1"),
      tags$li("Item 2")
    )
  )
)

# Server ------------------------------------------------------------------

server <- function(input, output, session) {
  observeEvent(input$link_to_tabpanel_b, {
    tags$a(href = "#tab-4527-2")
  })
}

shinyApp(ui, server)

The following solution is based on the inputs I got from the comments.以下解决方案基于我从评论中获得的输入。

Note that updateTabsetPanel() belongs to shiny while updateTabItems() is a function of the shinydashboard package.注意, updateTabsetPanel()属于shinyupdateTabItems()是一个函数shinydashboard包。 They seem to work interchangeably.它们似乎可以互换工作。

library(shiny)
library(shinydashboard)

# UI ---------------------------------------------------------------------

ui <- fluidPage(
  tabsetPanel(
    id = "panels",
    tabPanel(
      "A",
      p(),
      actionLink("link_to_tabpanel_b", "Link to panel B")
    ),
    tabPanel(
      "B",
      h3("Some information"),
      tags$li("Item 1"),
      tags$li("Item 2"),
      actionLink("link_to_tabpanel_a", "Link to panel A")
    )
  )
)

# Server ------------------------------------------------------------------

server <- function(input, output, session) {
#   observeEvent(input$link_to_tabpanel_b, {
#     tags$a(href = "#tab-4527-2")
#   })
  observeEvent(input$link_to_tabpanel_b, {
    newvalue <- "B"
    updateTabItems(session, "panels", newvalue)
  })
  observeEvent(input$link_to_tabpanel_a, {
    newvalue <- "A"
    updateTabsetPanel(session, "panels", newvalue)
  })
}

shinyApp(ui, server)

You can give your tabsetPanel an id and use updateTabsetPanel with your observeEvent你可以给你tabsetPanel ID和使用updateTabsetPanelobserveEvent

library(shiny)

# UI ---------------------------------------------------------------------

ui <- fluidPage(
  tabsetPanel(id = "demo",
    tabPanel(
      "A",
      p(),
      actionLink("link_to_tabpanel_b", "Link to panel B")
    ),
    tabPanel(
      "B",
      h3("Some information"),
      tags$li("Item 1"),
      tags$li("Item 2")
    )
  )
)

# Server ------------------------------------------------------------------

server <- function(input, output, session) {
  observeEvent(input$link_to_tabpanel_b, {
    updateTabsetPanel(session, "demo", "B")
  })
}

shinyApp(ui, server)

We have just released a routing library , which makes linking in Shiny easy.我们刚刚发布了一个路由库,它使 Shiny 中的链接变得容易。 Here's how it looks like in a nutshell.简而言之,这就是它的样子。

make_router(
   route("<your_app_url>/main",  main_page_shiny_ui),
   route("<your_app_url>/other", other_page_shiny_ui)
)

More information can be found in this blog post .更多信息可以在这篇博文中找到。

I was struggling with the same issue and really wanted to link to a different tab via the URL .我正在为同样的问题苦苦挣扎,并且真的想通过 URL链接到不同的选项卡。 Thanks to the simple example of thesadie and by using an observe to parse inputs from the url, for me the following worked (and made it possible to switch the tab by adding /?tab=B to the URL, eg http://localhost:1234/?tab=B):感谢thesadie简单示例并通过使用观察来解析来自 url 的输入,对我来说以下工作(并且可以通过将/?tab=B添加到 URL 来切换选项,例如 http://localhost :1234/?tab=B):

library(shiny)

# UI ---------------------------------------------------------------------

ui <- fluidPage(
  tabsetPanel(id = "demo",
              tabPanel(
                "A",
                p(),
                actionLink("link_to_tabpanel_b", "Link to panel B")
              ),
              tabPanel(
                "B",
                h3("Some information"),
                tags$li("Item 1"),
                tags$li("Item 2")
              )
  )
)

# Server ------------------------------------------------------------------

server <- function(input, output, session) {
  # Allow url parsing
  observe({
    query <- parseQueryString(session$clientData$url_search)
    if (!is.null(query)) {
      for (name in names(query)) {
        if (name == "tab") {
          # Change tab
          try(updateTabsetPanel(session, "demo", selected = query[[name]]))
        } else {
          # Update inputs - this part is not really necessary if you just want to change the tabs, 
          # but I also needed to update other inputs from the url
          try(updateTextInput(session, name, value = query[[name]]), silent = TRUE)
        }
      }
    } 
  })
  
  observeEvent(input$link_to_tabpanel_b, {
    updateTabsetPanel(session, "demo", "B")
  })
}

shinyApp(ui, server)

According to the code and logic from Rappster.根据 Rappster 的代码和逻辑。 It is possible to set any kind of links.可以设置任何类型的链接。 Link to TabsetPanel can be used by updataTabsetPanel . TabsetPanel可以使用updataTabsetPanel Link to Navbar can use updateNavbarPage(session, inputId, selected = NULL) .链接到Navbar可以使用updateNavbarPage(session, inputId, selected = NULL) These can be found by ?updateTabsetPanel as following.这些可以通过?updateTabsetPanel找到,如下所示。

updateTabsetPanel(session, inputId, selected = NULL)

updateNavbarPage(session, inputId, selected = NULL)

updateNavlistPanel(session, inputId, selected = NULL)

Please notice selected is the new id that you can define for tabsetPanel , Navbar , or NavlistPanel .请注意selected是您可以为tabsetPanelNavbarNavlistPanel定义的新 ID。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM