我正在尝试使用 Shinydashboard 设置一个 Shiny 的应用程序,并且在大多数情况下,祝你好运。但是,我遇到了侧边栏行为的怪癖,我认为这是可以避免的,但还没有找到方法。
下面是一个重现我遇到的问题的小例子。基本上,有两个侧边栏菜单 - 菜单一和菜单二,每个都有两个 menuSubItem。在菜单项中切换子项工作正常。所以,如果我想从 subItemOne 切换到 subItemTwo,没问题。我可以做一整天。
我也可以跨菜单切换到 subItems,这样从 subItemOne 跳转到 subItemThree,这很好。问题在于试图切换回来。如果选择了 subItemOne,而我尝试转到 subItemThree 并返回 subItemOne,则无法执行此操作。我必须去subItemTwo,然后我才能打开SubItemOne。
有没有办法纠正这个设置,这样我就可以直接从 subItemOne 跳转到 subItemThree(或两个和四个)然后再返回?
library('shiny')
library('shinydashboard')
# Sidebar #############################
sidebar <- dashboardSidebar(
width = 290,
sidebarMenu(
menuItem('Menu One', tabName = 'menuOne', icon = icon('line-chart'),
collapsible =
menuSubItem('Sub-Item One', tabName = 'subItemOne'),
menuSubItem('Sub-Item Two', tabName = 'subItemTwo')
)
),
sidebarMenu(
menuItem('Menu Two', tabName = 'menuTwo', icon = icon('users'),
collapsible =
menuSubItem('Sub-Item Three', tabName = 'subItemThree'),
menuSubItem('Sub-Item Four', tabName = 'subItemFour')
)
)
)
# Body #############################
body <- dashboardBody(
tabItems(
tabItem(tabName = 'subItemOne',
h2('Selected Sub-Item One')
),
tabItem(tabName = 'subItemTwo',
h2('Selected Sub-Item Two')
),
tabItem(tabName = 'subItemThree',
h2('Selected Sub-Item Three')
),
tabItem(tabName = 'subItemFour',
h2('Selected Sub-Item Four')
)
)
)
# UI #############################
ui <- dashboardPage(
dashboardHeader(title = 'Test', titleWidth = 290),
sidebar,
body
)
# Server #############################
server <- function(input, output){
}
shinyApp(ui, server)
最佳答案
问题是选项卡项保持事件状态,单击事件选项卡项不会更新 UI。这可以通过一些 Javascript 修复。
library('shiny')
library('shinydashboard')
# Sidebar #############################
sidebar <- dashboardSidebar(
tags$head(
tags$script(
HTML(
"
$(document).ready(function(){
// Bind classes to menu items, easiet to fill in manually
var ids = ['subItemOne','subItemTwo','subItemThree','subItemFour'];
for(i=0; i<ids.length; i++){
$('a[data-value='+ids[i]+']').addClass('my_subitem_class');
}
// Register click handeler
$('.my_subitem_class').on('click',function(){
// Unactive menuSubItems
$('.my_subitem_class').parent().removeClass('active');
})
})
"
)
)
),
width = 290,
sidebarMenu(
menuItem('Menu One', tabName = 'menuOne', icon = icon('line-chart'),
collapsible =
menuSubItem('Sub-Item One', tabName = 'subItemOne'),
menuSubItem('Sub-Item Two', tabName = 'subItemTwo')
)
),
sidebarMenu(
menuItem('Menu Two', tabName = 'menuTwo', icon = icon('users'),
collapsible =
menuSubItem('Sub-Item Three', tabName = 'subItemThree'),
menuSubItem('Sub-Item Four', tabName = 'subItemFour')
)
)
)
# Body #############################
body <- dashboardBody(
tabItems(
tabItem(tabName = 'subItemOne',
h2('Selected Sub-Item One')
),
tabItem(tabName = 'subItemTwo',
h2('Selected Sub-Item Two')
),
tabItem(tabName = 'subItemThree',
h2('Selected Sub-Item Three')
),
tabItem(tabName = 'subItemFour',
h2('Selected Sub-Item Four')
)
)
)
# UI #############################
ui <- dashboardPage(
dashboardHeader(title = 'Test', titleWidth = 290),
sidebar,
body
)
# Server #############################
server <- function(input, output){
}
shinyApp(ui, server)
关于r - 在 ShinyDashboard 中的 menuSubItems 之间切换,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32847743/