Shiny semantische UI-Elemente in renderUI

Question

Diese Frage basiert auf meinem vorherigen über das Hinzufügen von uin semantischen Elementen in glänzenden Apps. Hier sind die Links zu den letzten Fragen:

Rating Stars in R shiny app, How to flip up shapes in shiny by clicking a button?

Ich bin in der Lage Bewertungssterne und Formen angezeigt werden, wenn sie direkt in UI.R. aufgebaut sind Allerdings brauche ich sie innerhalb eines renderUi, da ich eine Login-Seite habe und für die UI beobachte.

Hier Beispielcode:

Ui.R:

shinyUI(semanticPage(
    shinyjs::useShinyjs() 
    ,uiOutput("test"))) 

Server.R:

library(shiny) 
library(shinyjs) 
library(shiny.semantic) 
library(highlighter) 
jsCode <- " 
$('.shape').shape(); 
$('.ui.rating') .rating({}); 
" 


shinyServer(function(input, output) { 
    runjs(jsCode) 
    output$test <- renderUI({ 
     tagList(
     div(class="ui shape", 
      div(class="sides", 
       div(class="ui header side active","This side starts visible."), 
       div(class="ui header side","This is yet another side"), 
       div(class="ui header side","This is the last side"), 
       div(class="ui header side",div(class="ui star rating")) 
     ) 
    ), 
     tags$button(id="test", class="ui button", "Flip", onclick="$('.shape').shape('flip up');") 
    ) 
    }) 

}) 

Problem ist, dass die betreffenden Bewertungssterne nicht in der App angezeigt, wenn ich setzen sie in einer Render-Benutzeroberfläche. Wie kann ich das beheben?

Answer 1

Sie tun können:

output$test <- renderUI({ 
    tagList(
     div(class="ui shape", 
      div(class="sides", 
       div(class="ui header side active","This side starts visible."), 
       div(class="ui header side","This is yet another side"), 
       div(class="ui header side","This is the last side"), 
       div(class="ui header side",div(class="ui star rating")) 
     ) 
    ), 
     tags$button(id="test", class="ui button", "Flip", onclick="$('.shape').shape('flip up');"), 
     tags$script(HTML("$('.ui.rating').rating({});")) 
    ) 
    })