R : 나는이 같은 반짝 대시 보드 상자에 포함 버튼이 내 반짝 응용 프로그램에서 상자가 actionButton

Question

에 웹 링크를 추가

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

내가 버튼의 웹 링크를 포함 할을 같은 때 클릭하면 새 탭에서 해당 웹 페이지가 열립니다.

은 내가 대신이 작업을 수행 할 수 있다는 사실을 알고 :

# 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')" 

을 추가 할 수 있으며 이동합니다 수

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')") 
) 
) 

,536하는 새로운 탭

구글에

Answer 2

onclick 방법은 간단하지만 자바 스크립트를 사용합니다. 더 중요하게 링크를 동적으로 생성하려면 어색 할 것입니다. 내 앱에 사용자 입력에 따라 특정 페이지를 열 수있는 링크를 만들고 싶습니다. 버튼으로 링크를 만들면됩니다.

먼저 동적 부분은 uiOutput과 renderUI으로 처리합니다. 링크는 서버 부분에서만 생성 될 수 있기 때문입니다. 간단한 링크는 우리가 액션 버튼 모양을 볼 수있는 버튼을 만들려면

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

을 얻을

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

그냥 R이 줄을 실행 될 것입니다.

> 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> 

이제 우리는 버튼과 같은 링크를 가지고, 당신은 더 스타일 매개 변수를 사용하여 하나의 스타일을 사용자 정의 할 수 있습니다 또는 맞춤 CSS. chrome/firefox 개발자 도구로 앱을 열고 CSS를 원하는 효과로 수정 한 다음 www 폴더의 style.css에 수정 된 CSS를 추가하여 기본 스타일을 덮어 씁니다.

많은 HTML 태그 출력의 기능을 살펴보면 실제로 수많은 사용자 정의를 결합하고 조합하여 많은 사용자 정의를 얻을 수 있음을 알 수 있습니다.