由于您没有共享任何代码，这很难回答，因为我们没有您所在位置的参考/起点。
Here是我为您准备的一个 lightning 战，它展示了一些实现我认为您需要的东西的方法。
编辑：下面是我所包含的三个选项的片段。

• • 备选案文1**：限制每个父代的子代数。然后，您可以向父代添加一个弹性框以控制换行。根据需要重复此操作。

<div class="parent">
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
</div> //repeat

• • 备选案文2**：弹性基础

<div class="parent2">
    <div class="child2">
      <div class="grandchild"></div>
    </div>
    <div class="child2">
      <div class="grandchild"></div>
    </div>
   </div> // Put your data inside the grandchild component and add a flex basis to the child component

• • 备选案文3**：弯曲和位置

<div class="parent3">
    <div class="child3">
      <h2>1 </h2>
    </div>
    <div class="child3">
      <h2>2</h2>
    </div>
    <div class="child3">
      <h2>3</h2>
    </div>
    <div class="spacing"></div>
    <div class="child3">
      <h2>4 </h2>
    </div>
    <div class="child3">
      <h2>5</h2>
    </div>
    <div class="child3">
      <h2>6</h2>
    </div>
  </div>

这是我用过的所有款式

.parent {
      display: flex;
      font-size: 0;
      flex-wrap: wrap;
      margin: 10px;
    }
    .child {
      background: blue;
      margin: 10px 0 0 10px;
      height: 100px;
      width: 100px;
    }
    /* ....................................... */
    .parent2 {
      display: flex;
      font-size: 0;
      flex-wrap: wrap;
      margin: 10px;
    }
    .child2 {
      flex-basis: 30%;
      background: lightblue;
      margin: 10px 0 0 10px;
      height: 100px;
      width: 100px;
    }
    .grandchild {
      border: 3px solid red;
      height: 50px;
      width: 50px;
    }
    /* ....................................... */
    
.parent3 {
  width: 100%;
  min-height: 100px;
  height: auto;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.child3 {
  width: 100px;
  height: 100px;
  background-color: lightgreen;
  margin: 10px;
  position: relative;
}
.spacing {
  width: 100%;
  height: 5%;
}