vue客户端导出txt文件

如下

<template>
  <div class="app-container">
      <el-button type="primary" @click="onClickDownDaily">txt导出</el-button>
  </div>
</template>
export default {
  data() {
    return {
      tableData:[
        {id:1,name:'小明',age:18},
        {id:2,name:'小红',age:10},
        {id:3,name:'晓东',age:33}
      ]
    }
  },
  created() {
  },
  methods: {
    // txt文件导出
    onClickDownDaily() {
      var title = '>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>'+''+this.$moment(new Date()).format('YYYY-MM-DD HH:mm:ss')+''+'>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>'
      var str=''
      this.tableData.forEach(item=>{
        str+='ID:'+item.id+'   '+'名称:'+item.name+'   '+'年龄:'+item.age+'\r\n'
      })
      var allStr = title+'\r\n'+'\r\n'+str
      var export_blob = new Blob([allStr]);
      var save_link = document.createElement("a");
      save_link.href = window.URL.createObjectURL(export_blob);
      save_link.download = this.$moment(new Date()).format('YYYY-MM-DD HH:mm:ss')+'.txt';
      this.fakeClick(save_link);
    },
    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);
    }
  }
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容