当前位置: 首页 > news >正文

uni-app之app上传pdf类型文件

通过阅读官方文档发现,uni.chooseFile在app端不支持非媒体文件上传;
可以使用这个插件,验证过可以上传pdf;具体使用可以去看文档
在这里插入图片描述
插件地址
就是还是会出现相机,这个可能需要自己解决下
实现功能:上传只能上传一个,如果文件列表有值点击上传进行toast提示,不再出现选择文件弹框,
只获取数据,展示的文件列表使用uview的u-cell-group

<template><view class="day-que-page"><view class="feed-content"><u--form ref="uForm" :labelWidth="70"><u-form-item label="附件上传" prop="fileName" required><lsj-upload ref="lsjUpload" childId="dayUpload" :option="option" :formats="formats" :debug="debug"@uploadEnd="onuploadEnd" @progress="onprogre" @change="change" :multiple="false" :accept="accept"><u-button type="primary" @click="hanldUpload" size="mini"style="width: 180rpx;height: 30px;margin-top: 10rpx;">选择文件</u-button></lsj-upload></u-form-item></u--form><view class="" style="padding:24rpx"><u-cell-group><u-cell v-for="(item, index) in imageValue" :key="index" v-if="imageValue.length" :title="item.name"><u-icon slot="right-icon" size="12" name="close" @click="hanldDelete(item)"></u-icon></u-cell></u-cell-group></view></view><u-toast ref="uToast"></u-toast><view class="feed-bottom"><u-button text="完成" type="primary" @click="toTemplatePage" :loading="btnLoading"></u-button></view></view>
</template>``````javascriptimport {confrimFeedBack} from "../../utils/meetingDetail"export default {data() {return {fileList: [],dateId: "",imageValue: [],//文件存放列表option: {url: this.$store.state.baseUrl + "/api/psm/file/upload/file",//服务器地址name: 'file',header: {'Authorization': `Bearer ${uni.getStorageSync('token')}`}},accept: "application/pdf",formats: "pdf",debug: true,files: new Map(),btnLoading:false}},methods: {async toTemplatePage() {if (!this.imageValue.length) {this.showToastDesc("请进行附件上传");return;}let pages = getCurrentPages();let curPage = pages[pages.length - 1]; //当前页const prePage = pages[pages.length - 2]; //上一页prePage.$vm.getDayQueData(this.imageValue)uni.navigateBack({delta: 1})},hanldUpload() {if (this.imageValue.length) {this.showToastDesc("只能上传一个文件");return;}},//单个删除上传文件hanldDelete(itemFile) {this.imageValue.map((item, index) => {if (item.path === itemFile.path) {this.imageValue.splice(index, 1)}});},showToastDesc(text) {this.$refs.uToast.show({message: text,type: 'error',})},//完成上传onuploadEnd(item) {console.log(`${item.name}已上传结束,上传状态=${item.type}`);if (item['responseText']) {console.log('演示服务器返回的字符串JSON转Object对象');const responseText = JSON.parse(item.responseText);console.log(responseText, "上传成功的数据");if (responseText.code === 200) {this.imageValue.push({name: item.name,url: responseText.data});this.btnLoading=false;} else {this.showToastDesc(responseText.msg || "上传失败,请重试")}};},onprogre(item) {// 更新当前状态变化的文件this.files.set(item.name, item);console.log('打印对象', JSON.stringify(this.files.get(item.name)));},change(files) {const fileData = JSON.stringify([...files.values()]);if (fileData?.length) {const url = JSON.parse(fileData)[0].path;const name = JSON.parse(fileData)[0].name;console.log(url, name, "获取文件url");//触发上传this.$refs['lsjUpload'].upload();this.btnLoading=true;}// this.files = files;},},onLoad(props) {if (props.dayData && props.dayData !== 'null') {const dealData = JSON.parse(decodeURIComponent(props.dayData));// console.log(dealData)this.imageValue = [{...dealData}];}//当文件列表本来就有值的时候,点击上传弹出提示,不再弹出选择文件弹框//为什么使用setTimeout,option会触发show,导致设置的hide不生效const timeout = setTimeout(() => {if (this.imageValue.length) {this.$refs['lsjUpload'].hide();}if (timeout) {clearTimeout(timeout)}}, 600);},//监听文件列表的值,hide时候会触发hanldUploadwatch: {imageValue(val) {if (this.imageValue.length) {this.$refs['lsjUpload'].hide();}else{this.$refs['lsjUpload'].show()}}}}

相关文章:

uni-app之app上传pdf类型文件

通过阅读官方文档发现&#xff0c;uni.chooseFile在app端不支持非媒体文件上传&#xff1b; 可以使用这个插件&#xff0c;验证过可以上传pdf&#xff1b;具体使用可以去看文档 插件地址 就是还是会出现相机&#xff0c;这个可能需要自己解决下 实现功能&#xff1a;上传只能上…...

bash: sudo: command not found的解决方法 | 安装sudo

-bash: sudo: command not found的解决方法 https://www.cnblogs.com/pengpengboshi/p/16159443.html 报错 安装apt-get update报错由于没有公钥&#xff0c;无法验证下列签名&#xff1a; NO_PUBKEY A4B469963BF863CC解决办法是手动加入 &#xff08;sudo可去掉&#xff09;…...

电脑合上盖子无线网络不会断开

控制面板\硬件和声音\电源选项\系统设置 最终选择不会采取任何操作 选择不会采取任何操作...

【从零开始学习JAVA | 第四十篇】了解线程池

目录 前言&#xff1a; 线程池&#xff1a; 线程池的工作流程&#xff1a; 代码实现线程池&#xff1a; 任务拒绝策略&#xff1a; 线程池多大才算合适&#xff1f; 总结&#xff1a; 前言&#xff1a; 在Java编程中&#xff0c;线程池是一个强大的工具&#xff0c;它能…...

axios如何取消请求,其原理是什么?

axios 可以通过创建一个 CancelToken 来取消一个请求,基本原理是: 创建一个 CancelToken 的实例,它有一个 executor 函数,可以通过调用 executor 参数中的 cancel 函数来取消请求。在 axios 请求配置中指定 cancelToken 属性,将 CancelToken 实例传递进去。当我们需要取消请求…...

消息中间件 Asio (C++)

折腾了一上午&#xff0c;看到这个结果的时候泪目了兄弟闷&#xff0c;讲真。我的asio客户端成功收到服务端发来的消息了。虽然这确实是极其智障又简单的入门哈哈 下载独立版本 asio网络通信库新建cmake工程&#xff0c;CMakeLists.txt加载asioasio最简单的服务端和客户端代码…...

3.4 网络安全管理设备

数据参考&#xff1a;CISP官方 目录 IDS (入侵检测系统)网络安全审计漏洞扫描系统VPN&#xff08;虚拟专网&#xff09;堡垒主机安全管理平台 一、IDS (入侵检测系统) 入侵检测系统&#xff08;IDS&#xff09;是一种网络安全设备&#xff0c;用于监测和检测网络中的入侵行…...

前端高级面试题-JS

1. 原型 / 构造函数 / 实例 原型( prototype ): ⼀个简单的对象&#xff0c;⽤于实现对象的 属性继承。可以简单的理解成对象的爹。在 Firefox 和 Chrome 中&#xff0c;每个 JavaScript 对象中都包含⼀个__proto__ (⾮标准)的属性指向它爹(该对象的原型)&#xff0c;可 obj.p…...

AcWing 1564:哈希 ← 只具有正增量的二次探测法

【题目来源】https://www.acwing.com/problem/content/1566/【题目描述】 将一个由若干个不同正整数构成的整数序列插入到一个哈希表中&#xff0c;然后输出输入数字的位置。 哈希函数定义为 H(key)key%TSize&#xff0c;其中 TSize 是哈希表的最大大小。 利用只具有正增量的二…...

什么是媒体代发布?媒体代发布注意事项

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 媒体代发布是指将新闻稿或其他宣传内容委托给专业的媒体代理机构或公司进行发布和推广的活动。这些机构通常拥有丰富的媒体资源、人脉和经验&#xff0c;能够更好地将信息传递给目标受众…...

docker版jxTMS使用指南:使用jxTMS采集数据之二

本文是如何用jxTMS进行数据采集的第二部分&#xff0c;整个系列的文章请查看&#xff1a;docker版jxTMS使用指南&#xff1a;4.4版升级内容 docker版本的使用&#xff0c;请查看&#xff1a;docker版jxTMS使用指南 4.0版jxTMS的说明&#xff0c;请查看&#xff1a;4.0版升级内…...

系列六、Springboot操作RocketMQ

一、同步消息 1.1、发送&接收简单消息 1.1.1、发送简单消息 /*** 测试发送简单消息*/ Test public void sendSimpleMessage() {SendResult result rocketMQTemplate.syncSend("BOOT_TOPIC_SIMPLE", "我是一个简单消息");// 往[BOOT_TOPIC_SIMPLE]主…...

【jupyter异常错误】Kernel started:No module named ipykernel_launcher

尝试过的方案 pip install ipykernel 执行之后提示已经安装,但是执行代码依然报错 解决方案 python -m pip install ipykernel -U --force-reinstall 相当于是强制重新安装 安装成功后没有报错 注:根本原因应该是原来安装的包存在问题&#xff0c;虽然检测出来已经存在&#xf…...

使用langchain与你自己的数据对话(五):聊天机器人

之前我已经完成了使用langchain与你自己的数据对话的前四篇博客&#xff0c;还没有阅读这四篇博客的朋友可以先阅读一下&#xff1a; 使用langchain与你自己的数据对话(一)&#xff1a;文档加载与切割使用langchain与你自己的数据对话(二)&#xff1a;向量存储与嵌入使用langc…...

爬虫与搜索引擎优化:通过Python爬虫提升网站搜索排名

作为一名专业的爬虫程序员&#xff0c;我深知网站的搜索排名对于业务的重要性。在如今竞争激烈的网络世界中&#xff0c;如何让自己的网站在搜索引擎结果中脱颖而出&#xff0c;成为关键。今天&#xff0c;和大家分享一些关于如何通过Python爬虫来提升网站的搜索排名的技巧和实…...

2024软考系统架构设计师论文写作要点

一、写作注意事项 系统架构设计师的论文题目对于考生来说&#xff0c;是相对较难的题目。一方面&#xff0c;考生需要掌握论文题目中的系统架构设计的专业知识;另一方面&#xff0c;论文的撰写需要结合考生自身的项目经历。因此&#xff0c;如何将自己的项目经历和专业知识有机…...

【Maven】依赖范围、依赖传递、依赖排除、依赖原则、依赖继承

【Maven】依赖范围、依赖传递、依赖排除、依赖原则、依赖继承 依赖范围 依赖传递 依赖排除 依赖原则 依赖继承 依赖范围 在Maven中&#xff0c;依赖范围&#xff08;Dependency Scope&#xff09;用于控制依赖项在编译、测试和运行时的可见性和可用性。通过指定适当的依赖…...

数组slice、splice字符串substr、split

一、定义 这篇文章主要对数组操作的两种方法进行介绍和使用&#xff0c;包括&#xff1a;slice、splice。对字符串操作的两种方法进行介绍和使用&#xff0c;包括&#xff1a;substr、split (一)、数组 slice:可以操作的数据类型有&#xff1a;数组字符串 splice:数组 操作数组…...

程序漏洞:安全威胁的隐患

在当今数字化时代&#xff0c;计算机程序是现代社会的核心基石。然而&#xff0c;随着技术的进步&#xff0c;程序漏洞也成为了一个不可忽视的问题。程序漏洞可能导致数据泄露、系统崩溃、恶意攻击和经济损失等一系列问题。本文将深入探讨程序漏洞的定义、分类、影响和预防措施…...

0基础学C#笔记09:希尔排序法

文章目录 前言一、希尔排序的思想二、使用步骤总结 前言 希尔排序可以说是插入排序的一种变种。无论是插入排序还是冒泡排序&#xff0c;如果数组的最大值刚好是在第一位&#xff0c;要将它挪到正确的位置就需要 n - 1 次移动。也就是说&#xff0c;原数组的一个元素如果距离它…...

R语言AI模型部署方案:精准离线运行详解

R语言AI模型部署方案:精准离线运行详解 一、项目概述 本文将构建一个完整的R语言AI部署解决方案,实现鸢尾花分类模型的训练、保存、离线部署和预测功能。核心特点: 100%离线运行能力自包含环境依赖生产级错误处理跨平台兼容性模型版本管理# 文件结构说明 Iris_AI_Deployme…...

在 Nginx Stream 层“改写”MQTT ngx_stream_mqtt_filter_module

1、为什么要修改 CONNECT 报文&#xff1f; 多租户隔离&#xff1a;自动为接入设备追加租户前缀&#xff0c;后端按 ClientID 拆分队列。零代码鉴权&#xff1a;将入站用户名替换为 OAuth Access-Token&#xff0c;后端 Broker 统一校验。灰度发布&#xff1a;根据 IP/地理位写…...

汇编常见指令

汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX&#xff08;不访问内存&#xff09;XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...

JS设计模式(4):观察者模式

JS设计模式(4):观察者模式 一、引入 在开发中&#xff0c;我们经常会遇到这样的场景&#xff1a;一个对象的状态变化需要自动通知其他对象&#xff0c;比如&#xff1a; 电商平台中&#xff0c;商品库存变化时需要通知所有订阅该商品的用户&#xff1b;新闻网站中&#xff0…...

莫兰迪高级灰总结计划简约商务通用PPT模版

莫兰迪高级灰总结计划简约商务通用PPT模版&#xff0c;莫兰迪调色板清新简约工作汇报PPT模版&#xff0c;莫兰迪时尚风极简设计PPT模版&#xff0c;大学生毕业论文答辩PPT模版&#xff0c;莫兰迪配色总结计划简约商务通用PPT模版&#xff0c;莫兰迪商务汇报PPT模版&#xff0c;…...

【Linux手册】探秘系统世界:从用户交互到硬件底层的全链路工作之旅

目录 前言 操作系统与驱动程序 是什么&#xff0c;为什么 怎么做 system call 用户操作接口 总结 前言 日常生活中&#xff0c;我们在使用电子设备时&#xff0c;我们所输入执行的每一条指令最终大多都会作用到硬件上&#xff0c;比如下载一款软件最终会下载到硬盘上&am…...

【大厂机试题解法笔记】矩阵匹配

题目 从一个 N * M&#xff08;N ≤ M&#xff09;的矩阵中选出 N 个数&#xff0c;任意两个数字不能在同一行或同一列&#xff0c;求选出来的 N 个数中第 K 大的数字的最小值是多少。 输入描述 输入矩阵要求&#xff1a;1 ≤ K ≤ N ≤ M ≤ 150 输入格式 N M K N*M矩阵 输…...

break 语句和 continue 语句

break语句和continue语句都具有跳转作用&#xff0c;可以让代码不按既有的顺序执行 break break语句用于跳出代码块或循环 1 2 3 4 5 6 for (var i 0; i < 5; i) { if (i 3){ break; } console.log(i); } continue continue语句用于立即终…...

NineData数据库DevOps功能全面支持百度智能云向量数据库 VectorDB,助力企业 AI 应用高效落地

NineData 的数据库 DevOps 解决方案已完成对百度智能云向量数据库 VectorDB 的全链路适配&#xff0c;成为国内首批提供 VectorDB 原生操作能力的服务商。此次合作聚焦 AI 开发核心场景&#xff0c;通过标准化 SQL 工作台与细粒度权限管控两大能力&#xff0c;助力企业安全高效…...

claude3.7高阶玩法,生成系统架构图,国内直接使用

文章目录 零、前言一、操作指南操作指导 二、提示词模板三、实战图书管理系统通过4o模型生成系统描述通过claude3.7生成系统架构图svg代码转换成图片 在线考试系统通过4o模型生成系统描述通过claude3.7生成系统架构图svg代码转换成图片 四、感受 零、前言 现在很多AI大模型可以…...