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格式文件
基础教程推荐
猜你喜欢
- Vue实现计数器案例 2024-01-16
- CSS将img图片填满父容器div自适应容器大小的实现方法 2023-12-20
- 如何利用css3做一个盖章图标 2024-12-14
- 浅析前端路由简介以及vue-router实现原理 2024-02-10
- html网页中使用希腊字母的方法 2022-09-21
- Seajs源码详解分析 2024-01-16
- 详解Jotai Immer如何实现undo redo功能示例详解 2024-02-11
- js中键盘事件实例简析 2023-12-01
- vue+NuxtJS使用 scss 2023-10-08
- HTML页面编写的点点感受小结 2024-01-16
