如何将项目按其值分组

Question

<ul>
        <li v-for="item in birth" :key="item.id">
          <div v-for="infos in item.infos" :key="infos.pic">
            <div class="day">Birthday : {{infos.date}}</div>
            <img class="photo" :src="infos.pic">
            <div class="name">{{infos.name}}</div>
          </div>
        </li>
      </ul>

我需要显示一些信息，我想按他们的生日对其进行分组。目前，他们喜欢这样显示：

生日：06/28 图片 史蒂夫

生日：06/28 图片 约翰

生日：06/30 图片 克里斯

我希望它们像这样显示

生日：06/28 图片 史蒂夫 图片 约翰

生日：06/30 图片 克里斯

是否可以直接使用v-for和一些v-if来做到这一点？

Answer 1

尝试在lodash中使用此groupBy： https://lodash.com/docs/4.17.11#groupBy

Answer 2

我认为您不能直接使用vue做到这一点。我要做的是根据您的服务器端或使用计算的客户端端重新排列数据。