Vue 中下载文本内容为指定格式文件

灰太狼 2022-09-10 07:18 188阅读 0赞

Vue 中下载文本内容为指定格式文件，代码如下，直接复制即可

<el-button style="margin-bottom: 15px" type="primary" size="small" icon="el-icon-download" @click="saveCode">下载</el-button>

// 下载提示
        saveCode() { 
          this.$prompt('请输入文件名', '下载为txt文件', { 
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            inputPattern: /^(.)+$/,
            inputErrorMessage: '文件名不能为空'
          }).then(({ value }) => { 
            this.$message({ 
              type: 'success',
              message: '下载成功'
            });
            // this.fileName data 中定义
            this.fileName = value;
            this.downloadCode();
          }).catch(() => { 
            this.$message({ 
              type: 'info',
              message: '取消输入'
            });
          });
        },
        // 下载
        downloadCode() { 
          //定义文件内容，类型必须为Blob 否则createObjectURL会报错，this.code 为文本内容
          let content = new Blob([this.code])
          //生成url对象
          let urlObject = window.URL || window.webkitURL || window
          let url = urlObject.createObjectURL(content)
          //生成<a></a>DOM元素
          let el = document.createElement('a')
          //链接赋值
          el.href = url
          el.download = this.fileName + '.txt'
          //必须点击否则不会下载
          el.click()
          //移除链接释放资源
          urlObject.revokeObjectURL(url)
          // this.fileName 重置为空
          this.fileName = ''
        },

发表评论取消回复

表情：

评论列表（有 0 条评论，188人围观）

还没有评论，来说两句吧...

相关阅读

相关将读取的文本内容转换为特定格式

1 问题在完成小组作业的过程中，我们开发的“游客信息管理系统”中有一个“查询”功能，就是输入游客的姓名然后输出全部信息。要实现这个功能就需要从保存到外部的目录中读取文本并且

ゞ浴缸里的玫瑰/ 2024年03月16日 10:43/ 0 赞/ 47 阅读

相关【JavaScript】将文本内容下载为文件

如何将一段文本下载为文件？用下面的代码可以实现： function download(filename, text) { var element = do

末蓝、/ 2022年10月12日 12:28/ 0 赞/ 140 阅读

相关批量修改文件夹中所有文件的格式为指定格式

一、实现效果比如将【.png】格式的所有文件都批量替换为【.jpg】格式 ![a880200f903344cc9b30cdd4ff54d1fb.gif][] 二、

快来打我*/ 2022年09月16日 00:27/ 0 赞/ 174 阅读

相关 Vue 中下载文本内容为指定格式文件

Vue 中下载文本内容为指定格式文件，代码如下，直接复制即可 <el-button style="margin-bottom: 15px" type="primary

灰太狼/ 2022年09月10日 07:18/ 0 赞/ 189 阅读

相关文件中追加文本内容

实例代码： include "stdafx.h" include <iostream> include <fstream> includ

﹏ヽ暗。殇╰゛Y/ 2022年08月04日 14:45/ 0 赞/ 194 阅读

相关 excel日期格式转换为文本格式

今天测试读取excel并修改数据库数据的时候遇到几个小问题。 1.空指针，读写io异常蛮多的，获取不到的数据就是null 2.读取文件位置，开始找不到文件 3.读取日期格

末蓝、/ 2022年07月16日 07:18/ 0 赞/ 241 阅读

相关在vue中格式化表格中的时间为指定格式

> 在vue表格中如果直接绑定时间字段默认显示格式一般为：yyyy-MM-dd HH:mm:ss，但有时候只需要显示年月日或者时分秒，这时我们就可以用到过滤器（filte

朴灿烈づ我的快乐病毒、/ 2022年04月22日 15:52/ 0 赞/ 303 阅读

相关 php去除富文本编辑器中的内容格式

在新的项目中遇到需要在文章列表页显示文章内容的开头几行纯文字部分，因为后台是通过富文本编辑器添加的文章，直接返回的数据是带有格式的数据，造成列表页样式混乱，所以需要去除格式返回

灰太狼/ 2022年04月18日 02:47/ 0 赞/ 293 阅读

相关 xpath中根据指定文本内容定位标签

scrapy框架中 response.xpath('//div/span[contains(text(), "指定文本内容")]').extract()

╰+攻爆jí腚メ/ 2022年03月25日 14:28/ 0 赞/ 364 阅读

相关 vue中将日期转换为指定的格式

vue中将日期转换为指定的格式：方案一：这个方法是我觉得特别好用的：写一个转换日期的方法，直接使用就可以 //时间格式化函数，此处仅针对yyyy

柔情只为你懂/ 2021年09月13日 17:50/ 0 赞/ 583 阅读