el-carousel轮播图，一页五条数据，显示几页...

  // 此处 / 5就是每页显示几个卡片
  // 内容根据业务需要自定义

<el-carousel :autoplay="false">
          <el-carousel-item v-for="item in Math.ceil(swiper_data.length / 5)" :key="item">
            <div class="swiper_switchover">
              <div class="swiper_Item" v-for="(item, index) in getPageData(item)" :key="index">
                <!-- 卡片数据内容-->
                <div class="period_Title">{{ item.title }}</div>
                <div><el-rate v-model="item.star" disabled/></div>
              </div>
            </div>
          </el-carousel-item>
        </el-carousel>

// 轮播数据(模拟数据)
const swiper_data = ref([
  {id:'1', title:'2021402143期',star:3,period:'21',time:'2023.02.02-2023.02.03',stu:'26',teacher:['王老师','赵老师']},
  {id:'2', title:'2021402144期',star:4,period:'22',time:'2023.02.02-2023.02.03',stu:'26',teacher:['王老师','赵老师']},
  {id:'3', title:'2021402145期',star:5,period:'23',time:'2023.02.02-2023.02.03',stu:'26',teacher:['王老师','赵老师']},
  {id:'4', title:'2021402146期',star:4,period:'24',time:'2023.02.02-2023.02.03',stu:'26',teacher:['王老师','赵老师']},
  {id:'5', title:'2021402147期',star:3,period:'25',time:'2023.02.02-2023.02.03',stu:'26',teacher:['王老师','赵老师']} ...
])

const getPageData = (pageIndex) => {
    const startIndex = (pageIndex - 1) * 5;
    const endIndex = pageIndex * 5;
    return swiper_data.value.slice(startIndex, endIndex);
}

轮播样式

<style lang="scss" scoped>
.swiper_switchover{
  display: flex;
    margin: 50px 70px;
    .swiper_Item{
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 264px;
      height: 214px;
      background: rgb(0,0,0,.02);
      border-radius: 11px;
      margin-right: 24px;
      padding: 22px;
      box-sizing: border-box;
      .period_Title{
        font-weight: bold;
        font-size: 20px;
        color: rgb(0,0,0,.7);
      }
      .describe{
        font-weight: 400;
        font-size: 13px;
        color: rgb(0,0,0,.7);
      }
  }
  .swiper_Item:last-child{
    margin-right: 0;
  }
}
:deep(.el-carousel__arrow) {
  background: rgba(36, 196, 211, 0.1);
}
:deep(.el-carousel__arrow .el-icon){
  color: #24C4D3;
  font-size: 16px;
  font-weight: bold;
}
</style>