Vue - flex布局 justify-content: space-around / space-between 最后一行元素不对其解决方案（JS）

前言

本文的解决方案不止适用于 Vue（只不过用它做示例），原生 JS 或其他框架均可借助该算法完成。

使用 flex 布局时，设置 justify-content: space-around / space-between 属性后，会出现如下图所示问题： 我们希望最后一行 居左对齐 排列，如下图所示：

解决方案

解决方案有很多种，本文使用 补齐元素 方式完成，而非 :after 插入或更改布局。

源代码

请直接全部复制以下代码，运行即可。