前言
本文的解决方案不止适用于
Vue（只不过用它做示例），原生JS或其他框架均可借助该算法完成。
使用 flex 布局时，设置 justify-content: space-around / space-between 属性后，会出现如下图所示问题：
我们希望最后一行 居左对齐 排列，如下图所示：
解决方案
解决方案有很多种，本文使用 补齐元素 方式完成，而非
:after插入或更改布局。
源代码
请直接全部复制以下代码，运行即可。
<!-- 该示例使用 vue 进行计算 | 当然其他框架或原生JS算法同理(只不过获取数据的方式不同而已) -->
<!-- 注意: 切勿在元素未渲染之前进行获取(否则会报错) -->
<更多推荐
Vue - flex布局 justify-content: space-around / space-between 最后一行元素不对其解决方案（JS）
发布评论