日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

react 简单的表格导出

發布時間:2023/12/29 编程问答 30 豆豆
生活随笔 收集整理的這篇文章主要介紹了 react 简单的表格导出 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

react 簡單的表格導出

js-export-excel(純js 支持中文) ES6 module

當頁面需要導出簡單的excel時,如果需要純前端實現,可以使用js-export-excel

首先在項目當前目錄下安裝 npm install js-export-excel

其次在需要導出表格的頁面引入該組件 import ExportJsonExcel from “js-export-excel”;
再然后就可以開始寫代碼了,以下為具體實現內容:

// 點擊按鈕,在render中 <Button onClick={this.downloadExcel}> 導出excel表格 </Button>// 調用方法 downloadExcel = () => { // currentPro 是列表數據const { currentPro } = this.props;var option={};let dataTable = [];if (currentPro) {for (let i in currentPro.data) {if(currentPro.data){let obj = {'項目名稱': currentPro.data[i].name,'項目地址': currentPro.data[i].address,'考勤范圍': currentPro.data[i].radius,}dataTable.push(obj);}}}option.fileName = '項目統計'option.datas=[{sheetData:dataTable,sheetName:'sheet',sheetFilter:['項目名稱','項目地址','考勤范圍'],sheetHeader:['項目名稱','項目地址','考勤范圍'],}];var toExcel = new ExportJsonExcel(option); //newtoExcel.saveExcel();}

總結

以上是生活随笔為你收集整理的react 简单的表格导出的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。