uniapp app 导出excel 表格

直接复制运行   

<template><view><button @click="tableToExcel">导出一个表来看</button><view>{{ successTip }}</view></view>
</template><script>export default {data() {return {successTip: ''}},methods: {uuid() {return 'xxx-xxx-xxx'.replace(/[xy]/g, c => {var r = Math.random() * 16 | 0,v = c == 'x' ? r : (r & 0x3 | 0x8)return v.toString(16)})},tableToExcel() {// 要导出的json数据const jsonData = [{name: '科比',phone: '123456',email: '科比@163.com'},{name: '科比',phone: '123456',email: '科比@163.com'},{name: '科比',phone: '123456',email: '科比@163.com'},{name: '科比',phone: '123456',email: '科比@163.com'},]// 列标题let worksheet = 'sht1'let str ='<tr><td style="text-align: center">姓名</td><td style="text-align: center">电话</td><td style="text-align: center">邮箱</td></tr>'// 循环遍历,每行加入tr标签,每个单元格加td标签for (let i = 0; i < jsonData.length; i++) {str += '<tr>'for (let item in jsonData[i]) {// 增加\t为了不让表格显示科学计数法或者其他格式str += `<td>${jsonData[i][item] + '\t'}</td>`}str += '</tr>'}// 下载的表格模板数据let template = `<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml encoding="UTF-8"><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>${worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>${str}</table></body></html>`// 下载模板// #ifdef APP-PLUSthis.appExportFile(template)// #endif// 下载模板// #ifdef MP-WEIXINthis.wxExportFile(template)// #endif},// 导出文件到手机 fileData:要写入到文件的数据,返回参数为文档路径appExportFile(fileData, documentName = '项目Excel文件') {// PUBLIC_DOCUMENTS: 程序公用文档目录常量plus.io.requestFileSystem(plus.io.PUBLIC_DOCUMENTS, fs => {let rootObj = fs.root,fullPath = rootObj.fullPathconsole.log('开始导出数据********')// 创建文件夹rootObj.getDirectory(documentName, {create: true}, dirEntry => {// 创建文件,防止重名let fileName = 'excel' + this.uuid() + '.xlsx'dirEntry.getFile(fileName, {create: true}, fileEntry => {fileEntry.createWriter(writer => {writer.onwritestart = res => console.log('正在导出')//  /storage/emulated/0指的就是系统路径let pathStr = fullPath.replace('/storage/emulated/0', '')// 成功导出数据writer.onwrite = res => {// 文件路径let filePath = res.target.fileNameuni.hideLoading()setTimeout(() => {console.log('成功导出')this.successTip = `文件位置:${filePath}`uni.openDocument({filePath,success: res => console.log('打开文档成功'),fail: err => console.log(err)})}, 500)}// 写入内容writer.write(fileData)}, err => console.log(err.message))})})})},wxExportFile(template, documentName = '项目Excel文件') {const fs = wx.getFileSystemManager()// 创建文件名字, 防止重名let filePath = wx.env.USER_DATA_PATH + '/' + (documentName + this.uuid()) + '.xls'fs.writeFile({filePath,data: template,encoding: 'utf8',success: res => {wx.openDocument({filePath,showMenu: true, //是否显示右上角菜单success: res => console.log('打开文档成功。文件位置', filePath),fail: err => console.log(err)})},fail: err => console.info(err)})}}}
</script>

  这里用到小程序和app段的api

wx.getFileSystemManager()
获取全局唯一的文件管理器

返回值
FileSystemManager
 

wx.openDocument 预览文件
wx.openDocument({filePath,showMenu:true, //是否右上角菜单,这样就可以转发给好友了success: res => console.log('打开文档成功。文件位置', filePath),fail: err => console.log(err)})

uniapp 微信小程序 /APP json数据导出excel文件_uniapp导出excel文件_初遇你时动了情的博客-CSDN博客 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/120996.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

运行软件mfc100u.dll缺失是怎么办?mfc100u.dll丢失解决方法分享

Mfc100u.dll 丢失的问题可能困扰着许多使用计算机的用户。Mfc100u.dll 是一个重要的动态链接库文件&#xff0c;它包含了许多功能模块&#xff0c;如字符串处理、数学计算、文件操作等。当 Mfc100u.dll 文件丢失或损坏时&#xff0c;可能会导致许多应用程序无法正常运行&#x…

SW免安装的toolbox只读问题

把SOLIDWORKSDATA 整体复制到另外的目录&#xff0c;然后这里设置目录位置。不然原始位置有只读属性

全面横扫:dlib Python API在Linux和Windows的配置方案

前言 在计算机视觉和人工智能领域&#xff0c;dlib是一个备受推崇的工具库。它为开发者提供了强大的图像处理、机器学习和深度学习功能。在计算机视觉项目中&#xff0c;配置dlib Python API是一个重要的初始步骤。本文将引导读者详细了解在Linux和Windows系统上安装和配置dli…

QT的ui设计中改变样式表的用法

在QT的ui设计中,我们右键会弹出一个改变样式表的选项,很多人不知道这个是干什么的。 首先我们来看下具体的界面 首先我们说一下这个功能具体是干嘛的, 我们在设置很多控件在界面上之后,常常都是使用系统默认的样式,但是当有些时候为了美化界面我们需要对一些控件进行美化…

Swift 周报 第三十八期

文章目录 前言新闻和社区苹果自研调制解调器芯片受挫&#xff1a;速度太慢容易过热&#xff0c;落后高通 3 年App Store 现已接受适用于最新版操作系统的 App 和游戏提交 提案通过的提案正在审查的提案驳回的提案 Swift论坛推荐博文话题讨论关于我们 前言 本期是 Swift 编辑组…

搭建自己的搜索引擎之三

一、前言 接上一篇 搭建自己的搜索引擎之二&#xff0c;本篇主要讲一下我们如何操作ElasticSearch&#xff0c;就是最简单的增删改查命令怎么写。 二、几个概念 搭建自己的搜索引擎之一 这篇文章我们对比搜索引擎在做海量数据实时查询优于关系型数据库的一些原因&#xff0c…

Vue之ElementUI实现登陆及注册

目录 ​编辑 前言 一、ElementUI简介 1. 什么是ElementUI 2. 使用ElementUI的优势 3. ElementUI的应用场景 二、登陆注册前端界面开发 1. 修改端口号 2. 下载ElementUI所需的js依赖 2.1 添加Element-UI模块 2.2 导入Element-UI模块 2.3 测试Element-UI是否能用 3.编…

Windows的批处理——获取系统时间、生成当天日期日志

Windows批处理基础https://coffeemilk.blog.csdn.net/article/details/132118351 一、Windows批处理的日期时间 在我们进行软件开发的过程中&#xff0c;有时候会使用到一些批处理命令&#xff0c;其中就涉及到获取系统日期、时间来进行一些逻辑的判断处理&#xff1b;那么我们…

VIBRO-METER SIM-275D-24 200-582-200-011 控制主板模块产品特点

VIBRO-METER SIM-275D-24 200-582-200-011 控制主板模块是用于振动监测和控制系统的重要组成部分&#xff0c;其主要功能是接收和处理振动传感器的数据&#xff0c;以监测旋转设备的状态并执行必要的控制操作。以下是这个控制主板模块的一些可能特点和功能&#xff1a; 振动数据…

uni-app 之 文字分两行显示超出用省略号表示

uni-app 之 文字分两行显示超出用省略号表示 vue 将一大串文字分两行显示超出用省略号表示 通过css设置文字强制不换行超出用省略号表示: {white-space: nowrap; 文本强制不换行&#xff1b;text-overflow:ellipsis; 文本溢出显示省略号&#xff1b;overflow:hidden; 溢出的部…

【MATLAB第77期】基于MATLAB代理模型算法的降维/特征排序/数据处理回归/分类问题MATLAB代码实现【更新中】

【MATLAB第77期】基于MATLAB代理模型算法的降维/特征排序/数据处理回归/分类问题MATLAB代码实现 本文介绍基于libsvm代理模型算法的特征排序方法合集&#xff0c;包括&#xff1a; 1.基于每个特征预测精度进行排序&#xff08;libsvm代理模型&#xff09; 2.基于相关系数corr的…

Windows中实现将bat或exe文件作为服务_且实现命令行安装、配置、启动、删除服务

一、背景描述 在Windows环境下进行日常的项目开发过程中&#xff0c;有时候需要将bat文件或exe文件程序注册为Windows的服务实现开机自己运行&#xff08;没有用户登陆&#xff0c;服务在开机后也可以照常运行&#xff09;、且对于那些没有用户交互界面的exe程序来说只要在后台…