[vue]VUE+elemnt的纯前端报表

只需要VUE安装vue-json-excel,不需要现在其他东西，也不需要导入其他JS



首先在想要导出的el-table中添加@selection-change="handleSelectionChange"
即<el-table
                    :data="daptData"
                    height="550"
                    border
                    style="width: 100%"
                    @selection-change="handleSelectionChange">

然后通过
handleSelectionChange(val){
                this.json_data=[];
                for(let i=0;i<val.length;i++){
                    this.json_data=val.result[0]
                    Object.assign(this.json_data,val)
                }
                console.log(this.json_data)
            }
获取想要的报表的内容
安装插件vue-json-excel
在mian中引入
import JsonExcel from  'vue-json-excel'
Vue.component('downloadExcel',JsonExcel)
接下来设置导出按钮
<download-excel :data="json_data" :fields="json_fields" name="酬金审核列表"><el-button type="primary"    >导出</el-button></download-excel>
 export default {
 data() {
            return {
json_fields:{
                    username:"username",
                    policyName:"policyName",
                    courseName:"courseName",
                    resultSubmitTime:"result.submitTime",
                    resultMoney:"result.money",
                },
                json_data:[]
}
}
}

其中json_fields为你想导出的数据的表头，username:"username",前面的username为表头，后面的username为你想导出的数据，通过给json_data:[]赋值，比如说
json_data:[
{
username:"123"
}
]
其中json_data的username和json_fields里面的"username",对应
当你触发el-button，就会自动导出，所以要在触发el-button以前就给json_data赋值。