在闪亮中动态生成 argonSidebarItem

huangapple
go评论99阅读模式
英文:

Dynamically generate argonSidebarItem in shiny

问题

您想要动态生成选项卡项，但在您的尝试中，所有输入都在同一个屏幕上。要实现所需的动态选项卡，请将 uiOutput("apps_ui") 放在适当的选项卡内，如下所示：

  1. library(argonDash)
  2. library(argonR)
  3. library(shiny)
  5. ui <- argonDashPage(
  6.   header = argonDashHeader(
  7.     color = "header_custom",
  8.     gradient = TRUE,
  9.     top_padding = 3,
  10.     bottom_padding = 3
  11.   ),
  12.   sidebar = argonDashSidebar(
  13.     id = "app_sidebar",
  14.     vertical = TRUE,
  15.     side = "left",
  16.     size = "md",
  17.     background = "sidebar_custom",
  18.     wellPanel(id = "well_panel", argonDash::argonSidebarMenu(
  19.       shiny::br(),
  20.       argonDash::argonSidebarItem(tabName = "home", "Home", icon = htmltools::tags$i(class = paste0("fa fa-home"))),
  21.       shiny::br(),
  22.       argonDash::argonSidebarItem(tabName = "dynamic_tabs", "Dynamic Tabs", icon = argonR::argonIcon(name = "sound-wave")),
  23.       shiny::br()
  24.     ))
  25.   ),
  26.   body = argonDashBody(
  27.     id = "app_body",
  28.     argonTabItems(
  29.       argonTabItem(tabName = "home", p("Test")),
  30.       argonTabItem(tabName = "dynamic_tabs", uiOutput("apps_ui")) # 放在 "dynamic_tabs" 选项卡内
  31.     )
  32.   ),
  33.   footer = NULL
  34. )
  36. server <- function(input, output, session) {
  37.   apps_fns <- c("id_study_metrics", "id_demo_app")
  38.   prefix_removed <- sub("id_", "", apps_fns)
  40.   output$apps_ui <- renderUI({
  41.     lapply(seq_along(apps_fns), function(i) {
  42.       argonTabItem(
  43.         tabName = prefix_removed[i],
  44.         br(),
  45.         textInput(apps_fns[i], "text", placeholder = prefix_removed[i])
  46.       )
  47.     })
  48.   })
  49. }
  51. shinyApp(ui, server)

现在，uiOutput("apps_ui") 已放置在名为 "Dynamic Tabs" 的选项卡中，您应该能够看到动态生成的选项卡项。

英文:

My expected output looks like this -

  1. library(argonDash)
  2. library(argonR)
  3. library(shiny)
  5. ui &lt;- argonDashPage(
  6.   header = argonDashHeader(
  7.     color = &quot;header_custom&quot;,
  8.     gradient = TRUE,
  9.     top_padding = 3,
  10.     bottom_padding = 3
  11.   ),
  12.   sidebar = argonDashSidebar(
  13.     id = &quot;app_sidebar&quot;,
  14.     vertical = TRUE,
  15.     side = &quot;left&quot;,
  16.     size = &quot;md&quot;,
  17.     background = &quot;sidebar_custom&quot;,
  18.     wellPanel(id = &quot;well_panel&quot;, argonDash::argonSidebarMenu(
  19.       shiny::br(),
  20.       argonDash::argonSidebarItem(tabName = &quot;home&quot;, &quot;Home&quot;, icon = htmltools::tags$i(class = paste0(&quot;fa fa-home&quot;))),
  21.       shiny::br(),
  22.       argonDash::argonSidebarItem(tabName = &quot;study_metrics&quot;, &quot;Study Metrics&quot;,icon = argonR::argonIcon(name = &quot;sound-wave&quot;)),
  23.       shiny::br(),
  24.       argonDash::argonSidebarItem(tabName = &quot;demo_app&quot;, &quot;Demo App&quot;),
  25.       shiny::br()
  26.     )
  27.     )
  28.   ),
  29.   body = argonDashBody(
  30.     id = &quot;app_body&quot;,
  31.     argonTabItems(
  32.       argonTabItem(tabName = &quot;home&quot;, p(&quot;Test&quot;)),
  33.       argonTabItem(tabName = &quot;study_metrics&quot;,
  34.         br(),textInput(&#39;id_study_metrics&#39;, &#39;text&#39;, placeholder = &#39;study_metrics&#39;)
  35.       ),
  36.       argonTabItem(tabName = &quot;demo_app&quot;,
  37.         br(),textInput(&#39;id_demo_app&#39;, &#39;text&#39;, placeholder = &#39;demo_app&#39;)
  38.       )
  39.     )
  40.   ),
  41.   footer = NULL
  42. )
  44. server &lt;- function(input, output, session) {
  45.   
  46. }
  47. shinyApp(ui, server)

在闪亮中动态生成 argonSidebarItem

The part that I want to change is -

  1.  argonTabItem(tabName = &quot;study_metrics&quot;,
  2.         br(),textInput(&#39;id_study_metrics&#39;, &#39;text&#39;, placeholder = &#39;study_metrics&#39;)
  3.       ),
  4.       argonTabItem(tabName = &quot;demo_app&quot;,
  5.         br(),textInput(&#39;id_demo_app&#39;, &#39;text&#39;, placeholder = &#39;demo_app&#39;)
  6.       )

I want to generate this tab items dynamically because this list going to expand in future.

My attempt -

  1. library(argonDash)
  2. library(argonR)
  3. library(shiny)
  5. ui &lt;- argonDashPage(
  6.   header = argonDashHeader(
  7.     color = &quot;header_custom&quot;,
  8.     gradient = TRUE,
  9.     top_padding = 3,
  10.     bottom_padding = 3
  11.   ),
  12.   sidebar = argonDashSidebar(
  13.     id = &quot;app_sidebar&quot;,
  14.     vertical = TRUE,
  15.     side = &quot;left&quot;,
  16.     size = &quot;md&quot;,
  17.     background = &quot;sidebar_custom&quot;,
  18.     wellPanel(id = &quot;well_panel&quot;, argonDash::argonSidebarMenu(
  19.       shiny::br(),
  20.       argonDash::argonSidebarItem(tabName = &quot;home&quot;, &quot;Home&quot;, icon = htmltools::tags$i(class = paste0(&quot;fa fa-home&quot;))),
  21.       shiny::br(),
  22.       argonDash::argonSidebarItem(tabName = &quot;study_metrics&quot;, &quot;Study Metrics&quot;,icon = argonR::argonIcon(name = &quot;sound-wave&quot;)),
  23.       shiny::br(),
  24.       argonDash::argonSidebarItem(tabName = &quot;demo_app&quot;, &quot;Demo App&quot;),
  25.       shiny::br()
  26.     )
  27.     )
  28.   ),
  29.   body = argonDashBody(
  30.     id = &quot;app_body&quot;,
  31.     argonTabItems(
  32.       argonTabItem(tabName = &quot;home&quot;, p(&quot;Test&quot;)),
  33.       uiOutput(&quot;apps_ui&quot;)
  34.     )
  35.   ),
  36.   footer = NULL
  37. )
  40. server &lt;- function(input, output, session) {
  41.   apps_fns &lt;- c(&quot;id_study_metrics&quot;, &quot;id_demo_app&quot;)
  42.   prefix_removed &lt;- sub(&quot;id_&quot;, &quot;&quot;, apps_fns)
  43.   
  44.   output$apps_ui &lt;- renderUI({
  45.     lapply(seq_along(apps_fns), function(i) {
  46.       argonTabItem(
  47.         tabName = prefix_removed[i],
  48.         br(),
  49.         textInput(apps_fns[i], &quot;text&quot;, placeholder = prefix_removed[i])
  50.       )
  51.     })
  52.   })
  53. }
  55. shinyApp(ui, server)

but that does not respect the tabs and all the inputs are consolidated into the same screen.

在闪亮中动态生成 argonSidebarItem

I did a lot of attempts using tagList etc but none of them are working for me the way I want it to. Sorry for the very long code but I wanted to make sure that I give a complete reproducible code similar to my case.

答案1

得分: 1

  1. 我会在您的服务器上呈现整个选项卡集，而不仅仅是一些选项卡：
  3. #### UI
  4. ```r
  5. # ...
  6.   body = argonDashBody(
  7.     id = "app_body",
  8.     uiOutput("apps_ui")
  9.   )
  10. # ....

Server

  1. output$apps_ui <- renderUI({
  2.     tabs <- lapply(seq_along(apps_fns), function(i) {
  3.       argonTabItem(
  4.         tabName = prefix_removed[i],
  5.         br(),
  6.         textInput(apps_fns[i], "text", placeholder = prefix_removed[i])
  7.       )
  8.     })
  9.     tabs <- c(
  10.        list(argonTabItem(tabName = "home", p("Test"))),
  11.        tabs)
  12.     do.call(argonTabItems, tabs)  
  13.   })

Explanation

在您的原始方法中，您有一个包含动态输入的 div。这对应于一个选项卡。最终，您希望像这样：

  1. argonTabs(tab1, tab2, tab3)

但最终您传递了

  1. argonTabs(tab1, list(tab2, tab3))

这在概念上是不同的（基本上您告诉R在第二个tab中将两个"tabs"放入列表中）。因此，您必须让服务器呈现整个内容，以便更精细地控制如何填充选项卡。

  2. <details>
  3. <summary>英文:</summary>
  5. I would render the __whole__ tab set in your server and not only some tabs:
  7. #### UI
  8. ```r
  9. # ...
  10.   body = argonDashBody(
  11.     id = &quot;app_body&quot;,
  12.     uiOutput(&quot;apps_ui&quot;)
  13.   )
  14. # ....

Server

  1. output$apps_ui &lt;- renderUI({
  2.     tabs &lt;- lapply(seq_along(apps_fns), function(i) {
  3.       argonTabItem(
  4.         tabName = prefix_removed[i],
  5.         br(),
  6.         textInput(apps_fns[i], &quot;text&quot;, placeholder = prefix_removed[i])
  7.       )
  8.     })
  9.     tabs &lt;- c(
  10.        list(argonTabItem(tabName = &quot;home&quot;, p(&quot;Test&quot;))),
  11.        tabs)
  12.     do.call(argonTabItems, tabs)  
  13.   })

Explanation

In your original approach you have one div holding the dynamic input. This corresponds to one tab. Eventually you want something like:

  1. argonTabs(tab1, tab2, tab3)

but in the end you are passing

  1. argonTabs(tab1, list(tab2, tab3))

which is conceptually different (basically you are telling R to put two &quot;tabs&quot; in a list on the second tab). Thus, you have to let the server do the rendering of the whole thing to get finer control of how to fill the tabs.

huangapple
  • 本文由 发表于 2023年5月11日 12:26:05
  • 转载请务必保留本文链接：https://go.coder-hub.com/76224156.html
  • argon
  • r
  • shiny
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定