首页 > 解决方案 > 使用 shinyjs 隐藏/显示 ui 元素

问题描述

我一直在开发一个闪亮的应用程序,它运行良好(参见https://ostaski.shinyapps.io/NextWordPredictR/)。

以下是相关代码:

    # ui.R
library(shiny)
library(shinyjs)

shinyUI(fluidPage(
  useShinyjs(),  # Set up shinyjs
  titlePanel("Next Word PredictR"),
  sidebarLayout(
    sidebarPanel("Top Next Words",
                 br(" "),
                 shinyjs::hidden # this hides topWords, but toggleState in server.R doesn't toggle!?!
                 (
                     tableOutput('topWords')
                 )
    ),

    mainPanel("Enter word(s) in the box below or click a button", # this works
    br(" "),
      tags$head(
        tags$style(HTML("
                          #button1, #button2, #button3, #button4
                          {
                            color: #FFFFFF;
                            font-weight: bold;
                            background-color: #00AEAE;
                            border-color: #FFFFFF;
                          }
                          #text
                          {
                            width: 82%;
                          }
                        "))
        ),
      tags$div(
          tags$textarea(id = 'text', label = 'Enter word(s) in the box below or click a button', rows = 2, class='form-control', "")), # label is not working
          br(" "),
          htmlOutput("firstWord", inline = T),
          htmlOutput("secondWord", inline = T),
          htmlOutput("thirdWord", inline = T),
          htmlOutput("fourthWord", inline = T),
          br(" "),
          p('Below are five sentences drawn from the English news corpus you can copy/paste into the box above. HINT: do not copy/paste the ellipses (...) or the next words (in bold).'),
          HTML('Another strong month of hiring makes it less likely that the Federal Reserve will take additional steps to boost the economy at its meeting next ... <strong>week.</strong>'),
          HTML('<br /><br />When Junior walked into the memorial service Sunday, "it was a surprise to everyone," Doug Smith, Oceanside&#8217;s postmaster, told ... <strong>me.</strong>'),
          HTML('<br /><br />&quot;The Voice,&quot; NBC&#8217;s upstart singing competition, is back for its second season Sunday, and the network is kicking it off in prime-time style -- positioning it right after the Super ... <strong>Bowl.</strong>'),
          HTML('<br /><br />The main health issue that caused Meyer to resign at UF was a sick program he left on life ... <strong>support.</strong>'),
          HTML('<br /><br />Scarlett Johansson filmed scenes at an old warehouse on Ashland Road near Longfellow Avenue, off Cedar Road near the Norfolk Southern railroad ... <strong>tracks.</strong>'),
          HTML('<br /><br /><strong>DISCLAIMER:</strong>  Yes, of course I cherry-picked these sentences. The grand majority of sentences I tested failed miserably. &#9786;')
        )
      )
      )
    )
    # server.R
    library(shiny)
    library(shinyjs)
    library(tm)
    library(qdap)
    library(dplyr)

    allGrams <- readRDS("allGrams.rds")

    predict <- function (inputString, allGrams) 
    {
    ...
    }

    shinyServer(function(input, output, session) {

    observe({
    ...
            shinyjs::toggleState("topWords", !is.null(input$text) && input$text != "") # these don't work either
#            shinyjs::toggleState("topWords", is.null(input$text) || input$text == "")
    ...

       })
    })

我试图在页面加载时隐藏 topwords 和按钮,然后在将单词输入 textarea 时显示它们。shinyjs::hidden()ui.R中确实隐藏了我的测试中的 topwords,但是shinyjs::toggleState()server.R中当我在 textarea 中输入一些文本时不显示 topwords。

我已经在这几天了,所以也许这很明显......也许这只是添加到的条件shinyjs::toggleState()

谢谢!

标签: rshinyshinyjs

解决方案


我设法弄清楚了。我没有在server.R中使用 shinyjs::toggleState() ,而是将其更改为仅 shinyjs::toggle() ,现在我得到了预期的效果。

不过,它似乎改变了预测,增加了两个词而不是一个词。

我会继续努力的。


推荐阅读