R shiny:将weblink添加到actionButton

Question

我的闪亮应用程序中有一个框,其中有一个按钮,包含在闪亮的仪表板框中,如下所示:

shiny::fluidRow(
  shinydashboard::box(title = "Intro Page", "Some description...", 
      shiny::actionButton(inputId='ab1', label="Learn More", icon = icon("th"))
  )
)

我想在按钮中包含一个weblink,这样当我点击它时,它应该在一个新标签中打开相应的网页.

我知道我可以这样做:

# this does not create a submit button though, it just creates a link.
tags$div(class = "submit",
         tags$a(href = "www.google.com", 
                "Learn More", 
                target="_blank")
)

但是使用actionButton,有一个很好的按钮,我可以添加一个看起来更美观的图标.

如何在有光泽的情况下添加actionButton的链接？

Answer 1

您可以添加参数

onclick ="location.href='http://google.com';"

点击操作按钮并点击它可以转到当前窗口中的google.com,也可以添加

onclick ="window.open('http://google.com', '_blank')"

并且您将在新标签中被带到Google

那是

shiny::fluidRow(
  shinydashboard::box(title = "Intro Page", "Some description...", 
      shiny::actionButton(inputId='ab1', label="Learn More", 
                          icon = icon("th"), 
                          onclick ="window.open('http://google.com', '_blank')")
  )
)

Answer 2

该onclick方法很简单，但是它依赖javascript。更重要的是，如果要动态生成链接，将会很尴尬。我想在我的应用程序中有一个链接，该链接可以根据用户输入打开特定页面，我发现您可以将链接修饰为按钮。

首先，我用uiOutput和处理动态部分renderUI，因为链接只能在服务器部分中生成。简单的链接将是

a(h4("Open Link"), target = "_blank", href = paste0("http://www.somesite/", some_link))

只需在R中运行此行即可

<a target="_blank" href="http://www.somesite/somelink">
  <h4>Open Link</h4>
</a>

要创建一个按钮，我们可以查看一个动作按钮的外观。

> actionButton("download", "Download Selected",
              icon = icon("cloud-download"))
<button id="download" type="button" class="btn btn-default action-button">
  <i class="fa fa-cloud-download"></i>
  Download Selected
</button>

然后我们可以做到这一点

shiny::a(h4("Open Link", class = "btn btn-default action-button" , 
    style = "fontweight:600"), target = "_blank",
    href = paste0("http://www.somesite/", some_link))

要得到

<a target="_blank" href="http://www.somesite/some_link">
  <h4 class="btn btn-default action-button" style="fontweight:600">Open Link</h4>
</a>

现在，我们有了一个看起来像按钮的链接，您可以使用style参数或自定义的css进一步自定义其样式。使用chrome / firefox开发人员工具打开您的应用，将css修改为所需的效果，然后将修改后的css添加到style.csswww文件夹中以覆盖默认样式。

如果查看许多html标记函数的输出，您会发现您实际上可以将很多东西组合在一起，以获得很多自定义内容。