vue-电脑端导出-txt

 // fakeClick(obj) {
    //   var ev = document.createEvent("MouseEvents");
    //   ev.initMouseEvent(
    //     "click",
    //     true,
    //     false,
    //     window,
    //     0,
    //     0,
    //     0,
    //     0,
    //     0,
    //     false,
    //     false,
    //     false,
    //     false,
    //     0,
    //     null
    //   );
    //   obj.dispatchEvent(ev);
    // },
    // exportRaw(name, data) {
    //   var urlObject = window.URL || window.webkitURL || window;
    //   var export_blob = new Blob([data]);
    //   var save_link = document.createElementNS(
    //     "http://www.w3.org/1999/xhtml",
    //     "a"
    //   );
    //   save_link.href = urlObject.createObjectURL(export_blob);
    //   save_link.download = name;
    //   this.fakeClick(save_link);
    // },
    // toExport() {
    //   if (this.dataList == false) {
    //     this.$createDialog({
    //       type: "alert",
    //       content: "数据為空",
    //       confirmBtn: "確定",
    //       icon: "cubeic-alert"
    //     }).show();
    //   } else {
    //     this.$createDialog({
    //       type: "confirm",
    //       icon: "cubeic-alert",
    //       content: "確定導出嗎?",
    //       confirmBtn: {
    //         text: "確定",
    //         active: true,
    //         disabled: false,
    //         href: "javascript:;"
    //       },
    //       cancelBtn: {
    //         text: "取消",
    //         active: false,
    //         disabled: false,
    //         href: "javascript:;"
    //       },
    //       onConfirm: () => {
    //         var data = [];
    //         this.dataList.forEach(x => {
    //           var datas = x.counter + "," + x.barcode + "," + x.qty + "\n";
    //           data.push(datas);
    //         });
    //         //合并数组为字符串
    //         var temp_string = data.join("");
    //         this.exportRaw("test.txt", temp_string);
    //       }
    //     }).show();
    //   }
    // },

 

转载于:https://www.cnblogs.com/huanhuan55/p/10081559.html

以下是使用vue-json-excel导出xlsx的步骤: 1.首先,安装vue-json-excel依赖包: ```shell npm install vue-json-excel --save ``` 2.在main.js中引入vue-json-excel并注册为全局组件: ```javascript import Vue from 'vue' import App from './App.vue' import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; import JsonExcel from "vue-json-excel"; // 引入vue-json-excel Vue.component("downloadExcel", JsonExcel); // 注册为全局组件 Vue.use(ElementUI); new Vue({ render: h => h(App), }).$mount('#app') ``` 3.在需要导出Excel的组件中,使用downloadExcel组件并传入数据和表头信息: ```html <template> <div> <download-excel :data="tableData" :columns="tableColumns" :filename="'excel文件名'" :sheetname="'sheet名称'" :title="'表格标题'" :autoWidth="true" :mergeCell="[]" > <el-button type="primary">导出Excel</el-button> </download-excel> </div> </template> <script> export default { data() { return { tableData: [ { name: '张三', age: 18, gender: '男' }, { name: '李四', age: 20, gender: '女' }, { name: '王五', age: 22, gender: '男' } ], tableColumns: [ { label: '姓名', field: 'name' }, { label: '年龄', field: 'age' }, { label: '性别', field: 'gender' } ] } } } </script> ``` 其中,data为需要导出的数据,columns为表头信息,filename为导出的Excel文件名,sheetname为sheet名称,title为表格标题,autoWidth为是否自动调整列宽,mergeCell为需要合并的单元格信息。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值