在 flexdashboard 中，是否可以单击 valueBox 来更新像 actionButton 一样的文本框？

Question

我正在尝试利用 flexdashboard 中的 valueBox 来显示标题图。但是，我还希望 valueBox 像 actionButton 一样工作，因为单击 valueBox 应该会触发仪表板其他地方的操作。

在查看 flexdashboard 文档时，我看到以下与 valueBox 相关的位：

链接值框

valueBox(42, icon = "fa-pencil", href="#details")

其中单击 valueBox 会将用户导航到具有“#details”锚点的不同页面。但是，没有任何迹象表明单击 valueBox 可用于其他操作。

下面是一个最小的相关 flexdashboard 代码

---
title: "valueBox Links"
output: 
  flexdashboard::flex_dashboard:
runtime: shiny
---

```{r setup, include=FALSE}
library(flexdashboard)

    ```

Tab 1 - Test
======================================================================

Column 
-------------------------------------

#### Three valueBoxes

### valueBox 1
```{r}
valueBox(1)
    ```

### valueBox 2
```{r}
valueBox(2)
    ```

### valueBox 3
```{r}
valueBox(3)
    ```

Column
-------------------------------------

### Text output
This is where I want some text to show up dynamically, depending on if the user has clicked valueBox 1, 2, or 3.

任何帮助将不胜感激:)

Answer 1

我为 valueBox 尝试了不同的参数，但没有成功。最后我设法通过将 actionButtons 放在 valueBoxes 的标题中来解决它，然后使用自定义样式使它们透明并扩展它们以覆盖整个 valueBox .看起来像这样，单击每个 valueBox 会在 "Text output":

下呈现不同的文本

我添加了颜色和图标以突出显示 valueBoxes 可以正常设置样式。它只使用 flexdashboard 库，并且完全响应。这是代码：

---
title: "valueBox Links"
output: 
  flexdashboard::flex_dashboard:
runtime: shiny
---

```{r setup, include=FALSE}
library(flexdashboard)
```

Tab 1 - Test
======================================================================

Column 
-------------------------------------

#### Three valueBoxes

### valueBox 1
```{r}
valueBox(1, caption = paste("I'm clickable!", actionButton("button1", " ", style = "background-color:rgba(39, 128, 227, 0.0); border-color:rgba(39, 128, 227, 0.0); position: absolute; overflow: hidden; left: 0px; top: 0px; right: 0px; bottom: 0px; width:100%")), icon = "fa-thumbs-up", color = "success")
```

### valueBox 2
```{r}
valueBox(2, caption = paste("I'm clickable too!", actionButton("button2", " ", style = "background-color:rgba(39, 128, 227, 0.0); border-color:rgba(39, 128, 227, 0.0); position: absolute; overflow: hidden; left: 0px; top: 0px; right: 0px; bottom: 0px; width:100%")), icon = "fa-tag", color = "warning")
```

### valueBox 3
```{r}
valueBox(3, caption = paste("ME TOO!", actionButton("button3", " ", style = "background-color:rgba(0, 0, 0, 0.0); border-color:rgba(0, 0, 0, 0.0); position: absolute; overflow: hidden; left: 0px; top: 0px; right: 0px; bottom: 0px; width:100%")), icon = "fa-random", color = "danger")
```

Column
-------------------------------------

### Text output
```{r}
textOutput("textout")

rv <- reactiveValues(data = NULL)

observeEvent(input$button1, {
rv$data <- "There are two types of people in the world: 1) Those who can extrapolate from incomplete data."
})

observeEvent(input$button2, {
rv$data <- "If you live to be one hundred, you’ve got it made. Very few people die past that age."
})

observeEvent(input$button3, {
rv$data <- "A statistician’s wife had twins. He was delighted. He rang the minister who was also delighted. “Bring them to church on Sunday and we’ll baptize them,” said the minister. “No,” replied the statistician. “Baptize one. We’ll keep the other as a control."
})  

output$textout <- renderText({
  rv$data
})
```

在 flexdashboard 中，是否可以单击 valueBox 来更新像 actionButton 一样的文本框？

In flexdashboard, can a valueBox be clicked to update a text box like an actionButton?

r

shiny

flexdashboard

链接值框