vuejs如何实现点击保存按钮把数据传到json/txt格式文件中并下载,下面编程教程网小编给大家详细介绍一下具体实现代码!
vuejs自带下载(非插件)
const element = document.createElement('a')
element.setAttribute('href', 'data:application/json;charset=utf-8,' + encodeURIComponent(this.code)) //下载json格式
//element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(this.code)) //下载txt格式
element.setAttribute('download', '文件名')
element.style.display = 'none'
element.click()
利用file-saver
脚手架
安装脚手架
npm install file-saver --save
需要的页面引入
import saveJson from 'file-saver'
//如果this.data是数组格式,需要转换格式[JSON.stringify(this.data)]
let arr = new Blob([this.data], { type: 'text/plain;charset=utf-8' })
saveJson(arr, `文件名.json`)
以上是编程学习网小编为您介绍的“vuejs如何实现下载json/txt格式文件”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
织梦狗教程
本文标题为:vuejs如何实现下载json/txt格式文件


基础教程推荐
猜你喜欢
- layui table 上面的switch开关切换,并获取表格里所有数据 2024-06-12
- 关于 javascript:Toggle v-navigation-drawer\\’s expa 2022-09-15
- javascript静态的url如何传递 2024-01-07
- 关于 javascript:Mapbox GeoJSON 通过本地 URL 加载:图标 2022-09-21
- html,css基础(3)~长度单位,元素阴影,表单元素,响应式布局 2023-10-27
- 一些常用的JavaScript函数(json)附详细说明 2024-01-06
- css实现电梯导航的项目实践 2024-02-05
- 浅析JSONP技术原理及实现 2024-01-07
- 使用CSS移动网页内容的详细指南 2023-10-08
- js变换显示图片的实例 2023-12-20