当 menuItem 中的更多功能使用闪亮和闪亮的仪表板时，tabItem 无法显示内容

Posted 2023-02-16

【中文标题】当 menuItem 中的更多功能使用闪亮和闪亮的仪表板时，tabItem 无法显示内容

【英文标题】：tabItem cannot show the content when more functions in menuItem using shiny and shinydashboard

【发布时间】：2018-05-09 05:12:59

【问题描述】：

我正在学习闪亮和闪亮的仪表板。我的代码是这样的：

library(shiny)
library(shinydashboard)
library(DT)
library(RODBC)
library(stringr)
library(dplyr)
ch<-odbcConnect('B1P HANA',uid='fchen4',pwd='XUEqin0312')
sidebar <- dashboardSidebar(
  sidebarMenu(
    menuItem("Query1",tabName="Query1",icon=icon("table"),
         numericInput('Start1','Start Date',19800312,min=20170101,max=20200101),
         numericInput('End1','End Date',19800312,min=20170101,max=20200101),
         textInput('Office1','Office ID','0'),
         submitButton("Submit")),
    menuItem("Query2",tabName="Query2",icon=icon("table"),
         numericInput('Start2','Start Date',20180101,min=20170101,max=20200101),
         numericInput('End2','End Date',20180101,min=20170101,max=20200101),
         textInput('Office2','Office ID','0'),
         submitButton("Submit"))
  )
)
body <- dashboardBody(
  tabItems(
    tabItem(tabName="Query1",h2("Dashboard tab content")),
    tabItem(tabName = "Query2",h2("Widgets tab content"))
  )
)
ui <- dashboardPage(
  dashboardHeader(title = 'LOSS PREVENTION'),
  sidebar,
  body
)
server <- function(input, output) 

shinyApp(ui, server)

仪表板如下所示：

您可以看到，当我在侧栏中放置一些输入框时，文本无法显示在主要部分。

但是，当我的代码是这样的时候：

library(shiny)
library(shinydashboard)
library(DT)
library(RODBC)
library(stringr)
library(dplyr)
ch<-odbcConnect('B1P HANA',uid='fchen4',pwd='XUEqin0312')
sidebar <- dashboardSidebar(
  sidebarMenu(
    menuItem("Query1",tabName="Query1",icon=icon("table")),
    menuItem("Query2",tabName="Query2",icon=icon("table"))
  )
)
body <- dashboardBody(
  tabItems(
    tabItem(tabName="Query1",h2("Dashboard tab content")),
    tabItem(tabName = "Query2",h2("Widgets tab content"))
  )
)
ui <- dashboardPage(
  dashboardHeader(title = 'LOSS PREVENTION'),
  sidebar,
  body
)
server <- function(input, output) 

shinyApp(ui, server)

那么结果是这样的：

您可以看到现在侧栏中没有输入，然后主栏中现在有文本。这太奇怪了。

【参考方案1】：

这实际上是目前shinydashboard 中非常烦人的事情。 Winston Chang 提供了一些解决方法here，但我认为最好的解决方案是this one：

基本上发生的情况是，当您将其他输入元素插入menuItem 时，它会丢失data-toggle 和data-value 属性。因此，dashboardBody 中的tabItems 无法再与menuItems 链接，因此应用程序无法在正文中显示内容。

您可以使用自定义函数（convertMenuItem）手动设置data-toggle和data-value，以便menuItems和tabItems再次链接。

代码：

library(shiny)
library(shinydashboard)

convertMenuItem <- function(mi,tabName) 
  mi$children[[1]]$attribs['data-toggle']="tab"
  mi$children[[1]]$attribs['data-value'] = tabName
  mi


sidebar <- dashboardSidebar(
  sidebarMenu(
    convertMenuItem(menuItem("Query1",tabName="Query1",icon=icon("table"),
             numericInput('Start1','Start Date',19800312,min=20170101,max=20200101),
             numericInput('End1','End Date',19800312,min=20170101,max=20200101),
             textInput('Office1','Office ID','0'),
             submitButton("Submit")), tabName = "Query1"),
    convertMenuItem(menuItem("Query2",tabName="Query2",icon=icon("table"),
             numericInput('Start2','Start Date',20180101,min=20170101,max=20200101),
             numericInput('End2','End Date',20180101,min=20170101,max=20200101),
             textInput('Office2','Office ID','0'),
             submitButton("Submit")), tabName = "Query2")
  )
)
body <- dashboardBody(
  tabItems(
    tabItem(tabName="Query1", h2("Dashboard tab content")),
    tabItem(tabName = "Query2", h2("Widgets tab content"))
  )
)
ui <- dashboardPage(
  dashboardHeader(title = 'LOSS PREVENTION'),
  sidebar,
  body
)

server <- function(input, output) 
shinyApp(ui, server)

结果