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.mzph.cn/news/92356.shtml

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

相关文章

Unity把UGUI再World模式下显示到相机最前方

Unity把UGUI再World模式下显示到相机最前方 通过脚本修改Shader 再VR里有时候要把3D的UI显示到相机最前方&#xff0c;加个UI相机会坏事&#xff0c;可以通过修改unity_GUIZTestMode来解决。 测试用例 测试用例如下&#xff1a; 场景包含一个红色的盒子&#xff0c;一个UI…

Linux作业2

Linux中的 stdin 、stderr、stdout分别是什么意思 在 Linux 中&#xff0c;stdin、stdout 和 stderr 是标准的输入、标准的输出和标准的错误的缩写&#xff0c;它们是与终端相关联的默认文件描述符&#xff0c;用于处理输入和输出。以下是它们的详细含义&#xff1a; stdin&am…

Java类与对象

文章目录 引出概念快速入门对象内存布局属性概念创建对象访问属性对象分配机制成员方法&#x1f996;注意事项和细节 引出 ●看一个养猫猫问题 张老太养了两只猫猫: 一只名字叫小白, 今年3岁, 白色. 还有一只叫小花, 今年100岁, 花色. 请编写一个程序, 当用户输入小猫的名字时…

zookeeper mac安装

目录 1.下载zookeeper安装包 2.解压安装包 3.修改配置文件 4.启动服务端 5.启动客户端 这边工作中用到了zookeeper组件&#xff0c;但自己独立安装弄的不太多&#xff0c;这边本机mac装一个做测试使用 以下是安装记录&#xff0c;可以作为参考 从以下链接zookeeper版本列…

当面试被问到jvm(Java虚拟机)时,如何将面试官引入自己的节奏?

本文目录 前言快问快答抛砖引玉锦上添花好书推荐总结 前言 作为一名Java开发工程师&#xff0c;不管是校招还是社招jvm一定是必问必会的知识点。虽然说真正开发中用到的不多&#xff0c;甚至可以说用不到&#xff08;对于刚入行或者Java初级&#xff09;&#xff0c;但是当面试…

Redis实现API访问频率限制

&#x1f337;&#x1f341; 博主猫头虎&#xff08;&#x1f405;&#x1f43e;&#xff09;带您 Go to New World✨&#x1f341; &#x1f984; 博客首页——&#x1f405;&#x1f43e;猫头虎的博客&#x1f390; &#x1f433; 《面试题大全专栏》 &#x1f995; 文章图文…

ffmpeg、ffplay在线安装,离线导出整个程序,移植到其他服务器使用(linux系统)

环境说明 以ubuntu系统作为说明 在线安装 下面命令会同时安装ffplay和ffmpeg sudo apt-get install ffmpeg怎么验证安装成功&#xff1f; 输入ffmpeg命令 ffmpeg&#xff0c;如图则说明安装成功 转储可执行程序和依赖的文件 找到安装路径&#xff0c;一般在/usr/bin目录…

Neo4j 与 Cypher 基础

更好的阅读体验 \huge{\color{red}{更好的阅读体验}} 更好的阅读体验 简介 Neo4j 是用 Java 实现的开源 NoSQL 图数据库。从2003年开始开发&#xff0c;2007年正式发布第一版&#xff0c;其源码托管于 GitHub。 与常见的关系型数据库不同&#xff0c;Neo4j 基于图图结构来表示…

10.01

服务器 #include<myhead.h> //键盘输入事件 int keybord_events(fd_set readfds) {char buf[128] "";int sndfd -1; //从终端获取一个文件描述符&#xff0c;发送数据给该文件描述符对应的客户端bzero(buf, sizeof(buf));int res scanf("…

CSP-J第二轮试题-2020年-1.2题

文章目录 参考&#xff1a;总结 [CSP-J2020] 优秀的拆分题目描述输入格式输出格式样例 #1样例输入 #1样例输出 #1 样例 #2样例输入 #2样例输出 #2 提示样例 1 解释数据规模与约定 答案1答案2 [CSP-J2020] 直播获奖题目描述输入格式输出格式样例 #1样例输入 #1样例输出 #1 样例 …

AI伦理与机器道德:人工智能的道德挑战

文章目录 什么是AI伦理和机器道德&#xff1f;1. 隐私保护2. 歧视和不平等3. 透明度和解释性4. 安全性5. 社会影响 AI伦理和机器道德的重要性1. 保护个人权利2. 避免不平等和歧视3. 保持透明和责任4. 促进创新 AI伦理挑战和解决方案1. 隐私保护2. 歧视和不平等3. 透明度和解释性…

C++八股

1、简述一下C中的多态 在面向对象中&#xff0c;多态是指通过基类的指针或引用&#xff0c;在运行时动态调用实际绑定对象函数的行为&#xff0c;与之相对应的编译时绑定函数称为静态绑定。 静态多态 静态多态是编译器在编译期间完成的&#xff0c;编译器会根据实参类型来选择…

第80步 时间序列建模实战:GRNN回归建模

基于WIN10的64位系统演示 一、写在前面 这一期&#xff0c;我们使用Matlab进行GRNN模型的构建。 使用的数据如下&#xff1a; 采用《PLoS One》2015年一篇题目为《Comparison of Two Hybrid Models for Forecasting the Incidence of Hemorrhagic Fever with Renal Syndrom…

使用SDKMAN在Linux系统上安装JDK

本文使用的Linux发行版为Rocky Linux 9.2&#xff0c;可以当做CentOS的平替产品。 SDKMAN是一个sdk包管理工具&#xff0c;通过自带的命令可以快速切换软件环境&#xff0c; 官网地址&#xff1a;https://sdkman.io/。 1、安装sdkman&#xff1a; # curl -s "https://ge…

SpringBoot整合RocketMQ笔记

SpringBoot版本为2.3.12.Release RocketMQ对比kafka 学习链接 https://zhuanlan.zhihu.com/p/335216381 代码实战 https://www.cnblogs.com/RedOrange/p/17401238.html Centos安装rocketmq https://blog.csdn.net/chuige2013/article/details/123783612 RocketMQ详细配置与…

【C语言深入理解指针(2)】

1. 数组名的理解 在上⼀个博客我们在使⽤指针访问数组的内容时&#xff0c;有这样的代码&#xff1a; int arr[10] {1,2,3,4,5,6,7,8,9,10}; int *p &arr[0];这⾥我们使⽤ &arr[0] 的⽅式拿到了数组第⼀个元素的地址&#xff0c;但是其实数组名本来就是地址&#x…

C++ - 开散列的拉链法(哈希桶) 介绍 和 实现

前言 之前我们介绍了&#xff0c;闭散列 的 开放地址法实现的 哈希表&#xff1a;C - 开放地址法的哈希介绍 - 哈希表的仿函数例子_chihiro1122的博客-CSDN博客 但是 闭散列 的 开放地址法 虽然是哈希表实现的一种&#xff0c;但是这种方式实现的哈希表&#xff0c;有一个很大的…

【操作系统】了解Linux操作系统中PCB进程管理模块与进程PID

本篇要分享的内容是有关于操作系统中进程的内容。 目录 1.进程的简单理解 2.了解task_struct&#xff08;进程控制模块&#xff09;内容分类 3.task_struct&#xff08;进程控制模块&#xff09;中的PID 4.调用查看PID的函数 1.进程的简单理解 首先我们需要理解的是什么是…

C++指针的使用

文章目录 1.C指针1.1 定义指针1.2 使用指针 2.空指针和野指针2.1 空指针2.2 野指针 3.指针所占空间4.使用const修饰指针4.1 const修饰指针4.2 const修饰常量4.3 const 既修饰指针也修饰常量 5.指针操作数组6.指针做函数参数7.使用指针知识实现冒泡排序 1.C指针 指针其实就是一…

SpringBoot整合数据库连接

JDBC 1、数据库驱动 JDBC&#xff08;Java DataBase Connectivity&#xff09;&#xff0c;即Java数据库连接。简而言之&#xff0c;就是通过Java语言来操作数据库。 JDBC是sun公司提供一套用于数据库操作的接口. java程序员只需要面向这套接口编程即可。不同的数据库厂商&…