uniapp 封装瀑布流组件

思路：

1.coulumns：需要分成几列

2.如何分布数据

3.计算每列的宽度

4.图片进行高度自适应

<template>
  <view :style="{ margin: boxM }">
    <view class="flex flex-justify-start bg-red" style="background-color: transparent; border-radius: 20rpx">
      <view
        class="waterfall-list"
        v-for="(item, index) in columnCount"
        :key="index"
        :style="{ width: width, margin: `0 ${itemGap}`, borderRadius: '20rpx' }"
      >
        <view v-for="(el, i) in list[index]" :key="i" class="waterfall-item">
          <slot name="content" :item="el" />
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { getSysInfo } from '@/utils/permi