reactNative导入excel文件

组件内导入

import {TouchableOpacity,PermissionsAndroid} from 'react-native';
import RNFS from 'react-native-fs';
import XLSX from 'xlsx';
import DocumentPicker from 'react-native-document-picker';
import {Buffer} from 'buffer';// 需要安装一下三个,Buffer和react-native无需安装"xlsx": "^0.18.5""react-native-fs": "^2.20.0","react-native-document-picker": "^9.0.1",

下面是逻辑代码

// 导入设备代码function importdevice() {console.log('导入设备');requestFileAccessPermission(async state => {if (state) {openDocumentPicker();} else {ToastAndroid.show('权限获取失败', 1500);}});}function parseDataArray(data) {// 第一行为表头,从第二行开始为数据行const header = ['name', 'gender', 'birthday', 'height', 'weight'];const dataArray = [];for (let i = 1; i < data.length; i++) {const row = data[i];const rowData = {};// 将表头与数据行的每个数据项组装成键值对for (let j = 0; j < header.length; j++) {rowData[header[j]] = row[j];}dataArray.push(rowData);}return dataArray;}async function openDocumentPicker() {try {const result = await DocumentPicker.pick({type: [DocumentPicker.types.allFiles], // 允许用户选择所有类型的文件});// 使用RNFS模块来读取文件内容const fileContents = await RNFS.readFile(result[0].uri, 'base64');const binaryData = Buffer.from(fileContents, 'base64');const workbook = XLSX.read(binaryData, {type: 'buffer'});const sheetNameList = workbook.SheetNames;const firstSheetName = sheetNameList[0];const worksheet = workbook.Sheets[firstSheetName];const data = XLSX.utils.sheet_to_json(worksheet, {header: 1});const members = parseDataArray(data);console.log('members',members);  // 这里就是excel文档数据,以数组格式展开} catch (error) {ToastAndroid.show('导入失败', 1500);if (DocumentPicker.isCancel(error)) {console.log('User cancelled the document picker.');} else {console.log('Error while picking the document:', error);}}}// 定义一个异步函数,用于请求文件访问权限async function requestFileAccessPermission(callBack) {try {const granted = await PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,{title: 'File Access Permission',message: 'This app needs access to your files.',buttonPositive: 'OK',},);if (granted === PermissionsAndroid.RESULTS.GRANTED) {console.log('File access permission granted.');callBack(true);} else {callBack(false);console.log('File access permission denied.');}} catch (error) {console.log('Error while requesting file access permission:', error);}}

触发导入的按钮

		  <TouchableOpacitystyle={[styles.beginSession]}onPress={importdevice}><Text style={styles.buttonTitle}>批量导入</Text></TouchableOpacity>

如下所示文档

在这里插入图片描述
打印结果如下

在这里插入图片描述

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

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

相关文章

elasticSearch put全局更新和单个字段更新语法

1、如下:更新改类型未doc(文档)的全局字段数据 注意:如果你使用的是上面的语句,但是只写了id和title并赋值,图片上其他字段没有填写,执行命令后,则会把原文档中的其他字段都给删除了,你会发现查询出来的结果中除了id和title,其他字段都没有了,如下: 2、 如果只是想更…

释放搜索潜力:基于ES(ElasticSearch)打造高效的语义搜索系统,让信息尽在掌握[1.安装部署篇],支持Linux/Windows部署安装

搜索推荐系统专栏简介:搜索推荐全流程讲解(召回粗排精排重排混排)、系统架构、常见问题、算法项目实战总结、技术细节以及项目实战(含码源) 专栏详细介绍:搜索推荐系统专栏简介:搜索推荐全流程讲解(召回粗排精排重排混排)、系统架构、常见问题、算法项目实战总结、技术…

SpringAOP源码解析之基础设施注册(一)

写在最前 AspectJ和Spring AOP是两种实现AOP&#xff08;面向切面编程&#xff09;的不同方式&#xff0c;它们在实现机制和使用方式上存在一些区别。 AspectJ是一种独立的AOP框架&#xff0c;它提供了比Spring AOP更强大和更灵活的功能。AspectJ可以在编译时或者运行时织入切…

vscode不显示横滚动条处理

最近发现vscode打开本地文件不显示水平的滚动条&#xff0c;但是打开一个临时文件是有水平滚动条的。 解决方案 可以一个个试 vscode配置 左下角设置–设置–搜索Scrollbar: Horizontal auto 自动visible 一直展示hidden 一直隐藏 拖动底部状态栏 发现是有的&#xff0c;但是…

Linux系统之file命令的基本使用

Linux系统之file命令的基本使用 一、file命令介绍1.1 Linux简介1.2 file命令简介 二、file命令的使用帮助2.1 file命令的help帮助信息2.2 file命令的语法解释2.3 file命令的man手册 三、文件类型介绍四、file命令的基本使用4.1 查询file版本4.2 显示文件类型4.3 输出时不显示文…

【Linux】部署单机OA项目及搭建spa前后端分离项目

目录 部署OA项目 ​编辑 搭建spa前后端分离项目 后端 前端 配置坏境变量 部署OA项目 在虚拟机中&#xff0c;将项目打包成war文件放置到tomcat根目录下的webapps文件目录下 再在主机数据库中连接数据库&#xff0c;并定义数据库名导入相关的表 继续进入tomcat目录下双击点…

三、【常用的几种抠图方式二】

文章目录 橡皮擦魔术橡皮擦背景橡皮擦选择被遮住&#xff08;调整边缘&#xff09;主体抠图 橡皮擦 直接擦除图片的像素&#xff0c;或者填充背景色&#xff0c;适用于要求不高的图片。 魔术橡皮擦 擦出颜色相近的内容&#xff0c;适用于主体跟背景颜色相差较大的情况&#x…

JVM进阶(2)

一)方法区: java虚拟机中有一个方法区&#xff0c;该区域被所有的java线程都是共享&#xff0c;虚拟机一启动&#xff0c;运行时数据区就被开辟好了&#xff0c;官网上说了方法区可以不压缩还可以不进行GC&#xff0c;JAVA虚拟机就相当于是接口&#xff0c;具体的HotSpot就是虚…

JVM(Java Virtual Machine)G1收集器篇

前言 本文参考《深入理解Java虚拟机》&#xff0c;本文主要介绍G1收集器的收集思想和具体过程&#xff08;填上一篇文章留下的坑&#xff09; 本系列其他文章链接&#xff1a; JVM&#xff08;Java Virtual Machine&#xff09;内存模型篇 JVM&#xff08;Java Virtual Machi…

网络协议--广播和多播

12.1 引言 在第1章中我们提到有三种IP地址&#xff1a;单播地址、广播地址和多播地址。本章将更详细地介绍广播和多播。 广播和多播仅应用于UDP&#xff0c;它们对需将报文同时传往多个接收者的应用来说十分重要。TCP是一个面向连接的协议&#xff0c;它意味着分别运行于两主…

Git撤销已经push到远程分支的commit

有时想要撤销已经push到远程仓库的commit&#xff0c;将代码还原为commit之前的样子&#xff0c;应该如何做呢&#xff1f; 如果只有自己使用的分支&#xff1a;可以使用git reset命令 git log 查看需要还原的commitId&#xff0c;如下截图&#xff0c; 我们需要撤销ffe4a的…

JVM虚拟机:对象在内存中的存储布局

本文重点 在前面的过程中,我们学习了对象创建过程,那么一个对象在内存中的布局是什么样的呢? 对象在内存中的存储布局 普通对象 当我们创建一个对象的时候,它由三部分组成,分别为对象头(MarkWord+class指针(指向class对象)),实例数据(对象的成员变量),填充。如果…