flex布局遇到多行单个列表最后一行对不齐的解决办法，解决写了justify-content:space-between之后还对不齐的办法

用ResizeObserver来解决，只不过不兼容ie，由于做的是混合app，所以不考虑ie，ie的话需要用到媒体查询或者其他办法，有更好的办法欢迎指教。
代码源码

// goods组件是要展示的数据
<div
 class="flex flex-wrap justify-between match-goods-com goods-com"
  ref="goodsCom"
>
  <goods
    v-for="(item, index) in productList"
    :key="index.id"
    type="ability"
    :goods="item"
    class="mb-20"
    :style="{
      marginRight: productMRIndexArr.includes(index)
        ? `${productMR}px`
        : 'auto',
    }"
  ></goods>
</div>

// js中
productList: [],
productMR: '', // 最后一行能力之间的间距
productMRIndexArr: [], // 哪些数据需要手动设置由边距（能力）

// css中需要设置一下伪元素
.match-goods-com {
  &::after {
    content: '';
    flex: auto;
  }
}

mounted() {
   // 监听goods组件最后一行的间距
   this.resizeObserver = new ResizeObserver(this.resizeChangeWH);
   this.resizeObserver.observe(document.querySelector('.goods-com'));
},
methods: {
   resizeChangeWH(entries) {
     this.productMRIndexArr = [];
     for (let entry of entries) {
       const childNodes = entry.target.childNodes;
       const groupArr = groupingData(childNodes, 'offsetTop');
       const lastGroupData =
         groupArr.length > 0 ? groupArr[groupArr.length - 1].list : [];
       const lastSecondGroupData =
         groupArr.length > 1 ? groupArr[groupArr.length - 2].list : [];
       // 如果最后一组数据长度小于第一组数据
       if (
         groupArr.length >= 2 &&
         lastGroupData.length < lastSecondGroupData.length
       ) {
         for (
           let i = childNodes.length - lastGroupData.length;
           i < childNodes.length - 1;
           i++
         ) {
           // 获取到第一个与第二个之间的间距
           this.productMR =
             lastSecondGroupData[1].offsetLeft -
             lastSecondGroupData[0].offsetLeft -
             lastSecondGroupData[0].offsetWidth;
           this.productMRIndexArr.push(i);
         }
       }
     }
   },
}