用vue2技术 一个div盒子里 有无数个一样的div尺寸大小的小盒子 一行4个间距一样

你可以使用Vue的循环指令(v-for)和CSS的flex布局来实现这个效果。具体的实现步骤如下：

1. 在Vue的组件中定义一个数组，用于存储小盒子的数据。

2. 使用v-for指令循环渲染小盒子，同时使用flex布局来控制小盒子的位置和间距。

3. 在CSS中设置小盒子的样式，包括尺寸大小、边框、背景色等。

以下是一个可能的实现代码示例：

<template>
  <div class="container">
    <div v-for="(item, index) in items" :key="index" class="box"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] // 小盒子的数据
    }
  }
}
</script>

<style>
.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.box {
  width: calc(25% - 10px); /* 一行4个，每个盒子占25%，减去间距 */
  height: 100px;
  margin-bottom: 20px; /* 下边距 */
  border: 1px solid #ccc;
  background-color: #f5f5f5;
}
</style>

在上面的代码中，container类用于设置flex布局，box类用于设置小盒子的样式。其中，width属性使用calc函数计算出每个小盒子的宽度，减去间距；margin-bottom属性设置下边距。通过这样的方式，你可以实现一个包含无数个一样大小的小盒子，并且每行显示4个且间距相同的效果。