保存数据为JSON文件导出

在utils下封装一个js文件

javascript 复制代码
export function saveJSON(data, filename) {
  if (!data
    alert('保存的数据为空')
    return
  }
  if (!filename) { filename = 'json文件.json' }
  if (typeof data === 'object') {
    data = JSON.stringify(data, undefined, 4)
  }
  var blob = new blob([data], { type: 'text/json' })
  var e = document.createEvent('MouseEvents')
  var a = document.createElement('a')
  a.downlaod = fielname
  a.href = window.URL.createObjectURL(blob)
  a.dataset.downloadurl = ['text/json', a.download, a.href].join(':')
  // 下面行方法已经不支持了,但不影响该函数的功能
  e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
  a.dispatchEvent(e)
}

在需要使用的页面导入该函数,传入数据和文件名可直接使用

javascript 复制代码
import { saveJSON } from '@/utils/EsJson'

// 直接调方法即可导出文件
saveJSON(data, '虚拟net表' + '.json')
相关推荐
JosieBook13 分钟前
【前端】Vue3 前端项目实现动态显示当前系统时间
前端·vue3·系统时间
Data_Adventure15 分钟前
AI让我6天开发完移动端大屏编辑器,卷吗?
前端
MiyueFE35 分钟前
Nuxt 4.0 深度解析:从架构革新到实战迁移 🚀
前端·nuxt.js
天天向上的鹿茸37 分钟前
web前端用MVP模式搭建项目
前端·javascript·设计模式
暖木生晖1 小时前
动画序列——实现一个div转一圈的效果
前端·css·html·css3·html5
山河木马1 小时前
前端学C++可太简单了:导入标准库
前端·javascript·c++
Hilaku1 小时前
你不会使用css函数 clamp()?那你太low了😀
前端·css·html
三小河1 小时前
解决小项目中的频繁部署-适用于没有Jenkins或者没有配置流水线的前端部署
前端
胡gh1 小时前
线程与进程:从零开始理解它们的区别与联系
前端·javascript·后端