2022.8.30

问题: 用element-ui实现歌单列表无限滚动，出现无限触发底部导致不断更新列表

原因：无限滚动列表ul和ul下的span所处的父盒子没有设置弹性布局flex导致，
要确保ul有高度（没有高度会无限触底不断更新），让li在滚动的时候能够触底，父盒子要设置弹性布局
`

<div class="play-list infinite-list-wrapper">
  <ul
    class="list"         //设置弹性布局
    v-infinite-scroll="load"
    infinite-scroll-disabled="disabled"
    style="height: 480px; overflow:auto"
  >
    <li
      v-for="(item, index) in playList"
      :key="index"
      class="list-item"
      @click="handleDetail(item.id)"
    >
      <el-image :src="item.coverImgUrl" alt="">
        <div slot="placeholder" class="image-slot">
          <img src="../assets/images/loading.png" />
        </div>
      </el-image>
      <p>{{ item.name }}</p>
    </li>
  </ul>
  <span v-if="loading">加载中...</span>
  <span v-if="noMore">没有更多了</span>
</div>

css样式中：
ul.list { display: flex; }