相关疑难解决方法(0)

我喜欢用卡片元素填充闪亮应用程序中的某个区域。当空间不足时，项目会流入下一行。这可以通过 来实现flowLayout。

但我事先不知道项目的数量，所以我需要循环创建卡片元素。但是当我在内部使用 lapply 时，flowLayout所有元素都显示在彼此下方。

如何解决这个问题，以便项目显示在彼此相邻的行中？

library(shiny)

card <- function(.img, .species, .sepal.length) {
  HTML(
    paste0(
      '<div class="card">
      <img src="', .img, '" style="width:100%">
      <div class="container">
      <h4><i>', .species, '</i></h4>
      <hr>
      <p>Sepal Length: ', .sepal.length, '</p>
      </div>
      </div>')
  )
}

img.src <- "https://www.plant-world-seeds.com/images/item_images/000/007/023/large_square/iris_baby_blue.jpg?1500653527"

ui <- fluidPage(
  tags$head(tags$style('.card {
                         width: 250px;
                       clear: both;
                       /* Add shadows to create the "card" effect */
                       box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
                       transition: 0.3s;
                       }
                       /* On mouse-over, add a deeper shadow */
                       .card:hover …