vue3 element ui 一维数组变二维数组，子数组长度为n

把一维数组变成二维数组，例如[1,2,3,4,5,6] ===> [[1,2],[3,4],[5,6]]
在特殊的情况下我们需要把后端传过来的数组变成我们想要的二维数组，比如在轮播图中每一页都需要2项数据的时候，然而后端传来的只能是1维的数组list。
先把方法写在src/utils/index.ts文件中

/**
 *把一维数组变成二维数组
 * @param {Array} arr  初始的1维数组[1,2,3,4,5,6]
 * @param {number} chunkSize 子数组的长度  如果为2则返回  [[1,2],[3,4],[5,6]]  如果为3则返回  [[1,2,3],[4,5,6]]
 * @returns {Array}
 */
export const chunkArray=(arr:Array<any>, chunkSize:number): Array<any>=> {  
  return arr.reduce((resultArray, item, index) => {  
      const chunkIndex = Math.floor(index / chunkSize);  

      if (!resultArray[chunkIndex]) {  
          resultArray[chunkIndex] = []; // 初始化新数组  
      }  

      resultArray[chunkIndex].push(item);  
      return resultArray;  
  }, []);  
}  

在vue文件中使用

<template>
		<div >
                <el-carousel  indicator-position="none" :autoplay="true" >
                    <el-carousel-item v-for="(item,index) in arr"  :key="item.id">
                        <el-row :gutter="40" class="main-el-row">
                            <el-col :span="item.length===2?12:24" v-for="d in item" >
                                <div>{{d.name}}</div>
                            </el-col>
                        </el-row>
                    </el-carousel-item>
                </el-carousel>
            </div>
 </template>
 <script setup  lang="ts">
import { chunkArray } from '@/utils'
import { qudata} from '@/api/index.ts';

const arr=ref<any[]>([]);
//查询数据
const query=async ()=>{
    arr.value=[];

  const res= await  qudata();//假设返回res.data 为[{id:1,name:'lisi'},{id:2,name:'wangwu'},{id:3,name:'lala'},{id:4,name:'wnwn'}]
  
  arr.value = chunkArray( res.data, 2)
  //输出  arr.value  = [[{id:1,name:'lisi'},{id:2,name:'wangwu'}],[{id:1,name:'lisi'},{id:2,name:'wangwu'}]]
}


onBeforeMount(()=>{
    query(); 
})
</script>