1.安装包
npm install vue-json-excel
2.引入组件
全局
import Vue from 'vue'
import JsonExcel from 'vue-json-excel'
Vue.component('downloadExcel', JsonExcel)
局部
import JsonExcel from "vue-json-excel";
components: {
DownloadExcel: JsonExcel,
},
3.导出
<download-excel
class="export-btn"
:data="excelDate"
:fields="jsonFields"
type="xls"
header="单"
name="单.xls"
>
<el-button type="primary" plain size="small" style="margin-right: 10px"
@click="excelFn()"
>导出
</el-button>
</download-excel>
data() {
return {
excelDate: [],
jsonFields: {
//导出Excel表格的表头设置
系数: 'Factor',
提示: 'Prompt',
名称: 'Name',
说明: 'Desc',
单价: 'lPrice',
数量: 'count',
单位: 'unit',
总价: 'PriceNew',
},
tableData:[]
}
},
methods: {
excelFn() {
this.shuju()//数据
},
}