vue3-前端实现导出xlsx

1.下载并且引入import * as XLSX from 'xlsx'

2.声明变量用于存储：let exportXlsx = reactive({list: [{}]})//导出数据存放

3.将需要导出的数据

exportXlsx.list =data.codeList.map((item:{code:string,codeStatus:string,useTime:string})=>{

                return {

                    code:item.code,

                    codeStatus:item.codeStatus,

                    useTime:item.useTime

                }

            })

map进去

4.使用导出方法:

const Eexport=()=>{

    const workbook = XLSX.utils.book_new()

    const worksheet = XLSX.utils.json_to_sheet(exportXlsx.list)//需要导出的数据

    XLSX.utils.book_append_sheet(workbook, worksheet, 'students')

//数组中对应map的数据顺序来命名

    XLSX.utils.sheet_add_aoa(worksheet,[['核销码','使用状态','使用时间']],{origin: 'A1'});(worksheet['!cols'] = [

    //工作表的宽度

    { wch:20 },

    { wch:20 },

    { wch:20 },

    { wch:20 },

    { wch:20 },

    { wch:20 }

    ]),

  //导出工作簿，并命名导出文件名为(自取有意义的名字).xlsx

  XLSX.writeFile(workbook, '用户列表.xlsx')

}

5.注各有所需：如果想要全局通用，小伙伴们自行按照参数等，进行封装