Удалить значок, который отображает или скрывает левую боковую панель в Shinydashboard для определенной вкладки панели - PullRequest
Новая
       10

Удалить значок, который отображает или скрывает левую боковую панель в Shinydashboard для определенной вкладки панели

0 голосов
/ 28 марта 2020

У меня есть блестящая панель инструментов внизу, в которой я хотел бы скрыть значок в левой части заголовка, который при нажатии скрывает или отображает левую боковую панель. Можно ли это скрыть только когда я на вкладке "Фронт"?

enter image description here

# app.R ##
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(DT)
library(shinyWidgets)
library(shinyjs)

dbHeader <- dashboardHeaderPlus(
                            enable_rightsidebar = TRUE,
                            rightSidebarIcon = "gears",
                            fixed = T
                            )

ui <- dashboardPagePlus(
  dbHeader,
  dashboardSidebar(),
  dashboardBody(
    useShinyjs(),
    tags$hr(),
    tabsetPanel(
      id ="tabA",
      type = "tabs",
      tabPanel("Front",icon = icon("accusoft")),
      tabPanel("Data", icon = icon("table")
      )
    )
  ),
  rightsidebar = rightSidebar()
)

server <- function(input, output) {
  observe({
    if (input$tabA == "Front") {
      hide(selector = "body > div.wrapper > header > nav > div:nth-child(4) > ul")
      addClass(selector = "body", class = "sidebar-collapse")
      removeClass(selector = "body", class = "control-sidebar-open")
    } else {
      show(selector = "body > div.wrapper > header > nav > div:nth-child(4) > ul")
      removeClass(selector = "body", class = "sidebar-collapse")
      addClass(selector = "body", class = "control-sidebar-open")
    }
  })
}

shinyApp(ui = ui, server = server)

1 Ответ

1 голос
/ 29 марта 2020

Если вы хотите скрыть только значок, вы можете сделать это с помощью некоторого кода Javascript. Чтобы вставить код JS в Shiny, необходимо использовать tags$script().

. Чтобы скрыть значок, введите код под dashboardBody()

   # Note: 'sidebar-toggle' is a class name (i.e. HTML class attribute) of Shiny icon 
   tags$script("document.getElementsByClassName('sidebar-toggle')[0].style.visibility = 'hidden';"),

И вывод: enter image description here

Подробнее о вставке JS в Shiny можно найти здесь: https://shiny.rstudio.com/articles/packaging-javascript.html

ОБНОВЛЕНО

Если вы хотите скрыть значок только тогда, когда пользователь находится на вкладке «Фронт», вы можете сделать это снова, вставив код JS, но на этот раз вы можете вставить его на сервер боковая часть (т.е. внутри вашей функции observe).

Таким образом, вам нужно вставить часть JS, которая будет скрывать значок, если нажата вкладка "Front" 

  shinyjs::runjs("document.getElementsByClassName('sidebar-toggle')[0].style.visibility = 'hidden';")

, и часть, которая будет отображать значок, если вкладка "Данные" "нажата 

  shinyjs::runjs("document.getElementsByClassName('sidebar-toggle')[0].style.visibility = 'visible';")

Таким образом, весь ваш код выглядит так 

# app.R ##
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(DT)
library(shinyWidgets)
library(shinyjs)

dbHeader <- dashboardHeaderPlus(
  enable_rightsidebar = TRUE,
  rightSidebarIcon = "gears",
  fixed = T
)

ui <- dashboardPagePlus(
  dbHeader,
  dashboardSidebar(),
  dashboardBody(
    useShinyjs(),
    tags$hr(),
    tabsetPanel(
      id ="tabA",
      type = "tabs",
      tabPanel("Front",icon = icon("accusoft")),
      tabPanel("Data", icon = icon("table")
      )
    )
  ),
  rightsidebar = rightSidebar()
)

server <- function(input, output) {
  observe({
    if (input$tabA == "Front") {
      hide(selector = "body > div.wrapper > header > nav > div:nth-child(4) > ul")
      addClass(selector = "body", class = "sidebar-collapse")
      removeClass(selector = "body", class = "control-sidebar-open")
      shinyjs::runjs("document.getElementsByClassName('sidebar-toggle')[0].style.visibility = 'hidden';")


    } else {
      show(selector = "body > div.wrapper > header > nav > div:nth-child(4) > ul")
      removeClass(selector = "body", class = "sidebar-collapse")
      addClass(selector = "body", class = "control-sidebar-open")
      shinyjs::runjs("document.getElementsByClassName('sidebar-toggle')[0].style.visibility = 'visible';")

    }
  })
}

shinyApp(ui = ui, server = server)
...