保存数据为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')
相关推荐
志尊宝5 分钟前
Vue3 零基础每日笔记(080):Vue3 + ECharts 数据可视化——封装可复用图表组件
前端·javascript·vue.js·笔记·信息可视化·echarts
阿狗童鞋6 分钟前
前端工程化实战指南
前端
CappuccinoRose6 分钟前
CSS 动效基础
前端·css·动画·animation·transition
用户4402818278076 分钟前
我用 TRAE 一晚上从零撸了个微信投票小程序: 17 个云函数 + 11 个页面的全链路实战
前端
BullSmall9 分钟前
SonarQube 9.9.8-community 适配 Jenkins 版本说明
java·前端·jenkins
tryCbest11 分钟前
第一篇:HTML5 核心知识全解 + 项目起步
前端·html·html5
百度一下吧18 分钟前
CSS 伪类使用与实践:从入门到进阶
前端·css
hunterandroid20 分钟前
android方案 : Multiplatform 跨平台开发实战:一套代码,多端运行
android·前端
百度一下吧23 分钟前
CSS3 之后新增的特性:从 CSS4 到现代 CSS 的演进
前端·css·css3