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

用element ui上传带参数的文件,并用flask接收

需求

网页需要实现上传一个csv文件,并携带两个表单的参数给后端

方法

上传组件

<el-uploadclass="upload-demo"dragaction="/upload" <!--要上传到的路由地址,跟flask路由函数对应-->accept=".csv" <!--只接收csv文件-->ref="upload" <!--引用标识-->:data="ruleForm" <!--额外参数的表单变量名-->:auto-upload="false":before-remove="beforeRemove":on-success="handleSuccess":limit="1"><i class="el-icon-upload"></i><div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
</el-upload>

JS部分

data() {return {ruleForm: {  // 和upload组件中的data参数值一致group_name: '',model_name: '',}
},methods: {onSubmit() {// 获取文件列表const fileList = this.$refs.upload.uploadFiles;// 判断是否有文件需要上传if (fileList.length > 0) {// 手动触发文件上传this.$refs.upload.submit();} else {this.$alert('请选择文件', '提示', {confirmButtonText: '确定',});}},}

flask接收部分

//这里就是upload组件的action地址
@app.route('/upload', methods=['POST', 'GET']) 
def upload():if request.method == 'POST':# 获取上传的文件file = request.files['file']result_df = pd.read_csv(file)# 额外参数s_id = request.form.get('group_name')model_name = request.form.get('model_name')# print("参数1:", s_id)# print("参数2:", model_name) return jsonify('success')

相关文章:

用element ui上传带参数的文件,并用flask接收

需求 网页需要实现上传一个csv文件&#xff0c;并携带两个表单的参数给后端 方法 上传组件 <el-uploadclass"upload-demo"dragaction"/upload" <!--要上传到的路由地址&#xff0c;跟flask路由函数对应-->accept".csv" <!--只接…...

[Android]使用Git将项目提交到GitHub

如果你的Mac还没有安装Git&#xff0c;你可以通过Homebrew来安装它&#xff1a; brew install git 方式一&#xff1a;终端管理 1.创建本地Git仓库 在项目的根目录下&#xff0c;打开终端&#xff08;Terminal&#xff09;并执行以下命令来初始化一个新的Git仓库&#xff1…...

python cv2.imread()和Image.open()的区别和联系

文章目录 1. cv2.imread()1.1 cv2.imread参数说明1.2 注意事项 2. Image.open()3. cv2.imread()与Image.open()相互转化3.1 cv2.imread()转成Image.open()&#xff1a;Image.fromarray()3.2 Image.open()转成cv2.imread()&#xff1a;np.array() 1. cv2.imread() cv2.imread()…...

hdlbits系列verilog解答(exams/m2014_q4i)-45

文章目录 一、问题描述二、verilog源码三、仿真结果 一、问题描述 实现以下电路&#xff1a; 二、verilog源码 module top_module (output out);assign out 1b0;endmodule三、仿真结果 转载请注明出处&#xff01;...

flink源码分析之功能组件(二)-kubeclient

简介 本系列是flink源码分析的第二个系列,上一个《flink源码分析之集群与资源》分析集群与资源,本系列分析功能组件,kubeclient,rpc,心跳,高可用,slotpool,rest,metrics,future。其中kubeclient上一个系列介绍过,为了系列完整性,这里“copy”一下。 kubeclient组件…...

无需API开发,有赞小程序集成广告推广系统,提升品牌曝光

无需API开发&#xff0c;实现有赞小程序与其他系统的连接 有赞小程序作为一个多功能的电子商务解决方案&#xff0c;为商家提供了无需复杂API开发就可以实现系统连接和集成的便捷途径。通过有赞小程序&#xff0c;商家可以轻松实现与各种系统的数据同步和应用互联&#xff0c;…...

CMD - ping

文章目录 前言参数 前言 ping 命令主要测试到达指定 IP 或主机的连通性. 参数 -t: ping 指定的计算机直到中断 -a: 将地址解析为主机名 -n count: 要发送的回显请求数...

数据结构与算法编程题23

设计二叉树的双序遍历算法&#xff08;双序遍历是指对于二叉树的每一个结点来说&#xff0c;先访问这个结点&#xff0c;再按双序遍历它的左子树&#xff0c;然后再一次访问这个结点&#xff0c;接下来按双序遍历它的右子树&#xff09; #define _CRT_SECURE_NO_WARNINGS#inclu…...

小程序中的大道理之二--抽象与封装

继续扒 接着 上一篇 的叙述, 健壮性也有了, 现在是时候处理点实际的东西了, 但我们依然不会一步到底, 让我们来看看. 一而再地抽象(Abstraction Again) 让我们继续无视那些空格以及星号等细节, 我们看到什么呢? 我们只看到一整行的内容, 当传入 3 时就有 3 行, 传入 4 时就…...

基于卷积神经网络CNN开发构建HAR人类行为识别Human Activity Recognition【完整代码实践】

行为识别相关的开发实践在我们之前的博文中也有过相关的实践了,感兴趣的话可以自行移步阅读即可:《python实现基于TNDADATASET的人体行为识别》 《UCI行为识别——Activity recognition with healthy older people using a batteryless wearable sensor Data Set》《人体行为…...

excel自己记录

1、清除换行符号 2、添加特殊符号&并清除换行符号 7日&15日&30日&60日 3、判断单元格最后一个字符是不是数字&#xff0c;不是就删掉 IF(ISNUMBER(--RIGHT(B2,1)),B2,SUBSTITUTE(B2,RIGHT(B2,1),"")) ISNUMBER(--RIGHT(B2,1))判断最右边的一个数是否…...

vcsa6.7 5480无法登录

停电维护硬件后&#xff0c;发现vcsa异常&#xff0c;https://ip:5480无法登录&#xff0c;https://ip/ui正常&#xff0c;ssh登录页正常 kb资料 通过端口 5480 登录到 VMware vCenter Server Appliance Web 控制台失败 (2120477) 操作过程 Connecting to 192.16.20.31:22..…...

CSS 属性列表

CSS属性列表 序号 属性类别 属性 描述 1 动画属性 keyframes 定义一个动画,keyframes定义的动画名称用来被animation-name所使用。 2 animation 复合属性。检索或设置对象所应用的动画特效。 3 animation-name 检索或设置对象所应用的动画名称 ,必须与规则keyfra…...

浅谈能源智能管理系统在大学高校中的应用

安科瑞 华楠 摘要&#xff1a;结合深圳南方科技大学能效系统工程设计实例&#xff0c;针对校园中电耗、热量消耗、冷量消耗及水资源消耗数据的采集、传输、分析管理系统&#xff0c;分析了系统中的水、电、气在高校中的能耗分布&#xff0c;并阐述了节能应用方案&#xff0c;可…...

脚本自动化定制开发:实现高效工作的魔法钥匙

在当今这个快节奏的工作环境中&#xff0c;自动化已成为提高工作效率的黄金标准。如果你是一名Windows用户&#xff0c;那么通过Windows脚本自动化&#xff0c;你可以将你的工作流程化繁为简&#xff0c;实现高效工作。而在众多Windows脚本自动化工具中&#xff0c;Python以其简…...

使用websocket获取thingsboard设备的实时数据

背景 有一个读者前来咨询,如何实时获取设备的遥测数据。 其实tb是有提供websocket接口来获取设备数据的。而且还支持js跨域调用。下面给大家演示一下。 websocket地址 完整代码 <!DOCTYPE HTML> <html><h...

使用Linux JumpServer堡垒机本地部署与远程访问

&#x1f308;个人主页&#xff1a;聆风吟 &#x1f525;系列专栏&#xff1a;网络奇遇记、Cpolar杂谈 &#x1f516;少年有梦不应止于心动&#xff0c;更要付诸行动。 文章目录 &#x1f4cb;前言一. 安装Jump server二. 本地访问jump server三. 安装 cpolar内网穿透软件四. 配…...

js的防抖与节流

目录 一、防抖 实现方式 二、节流 实现方式 一、防抖 所谓防抖&#xff0c;单位时间内&#xff0c;某个动作只能执行矗后一次&#xff0c;可以用在搜索框业务中。 性能优化的手段 防抖 --- 在同一时间内 频繁触发事件,只处理最后一次 实现方式 1、用第三方库Lodash防抖的…...

中职组网络安全-Windows操作系统渗透测试 -20221219win(环境+解析)

B-4:Windows操作系统渗透测试 任务环境说明: 服务器场景:20221219win 服务器场景操作系统:Windows(版本不详)(封闭靶机) 1.通过本地PC中渗透测试平台Kali对服务器场景Server08进行系统服务及版本扫描渗透测试,并将该操作显示结果中1433端口对应的服务版本信息作为F…...

git本地账户如何从一台电脑迁移到另外一台

为了表述方便&#xff0c;我们此处用旧电脑、新电脑指代。 在新电脑上安装git 例如&#xff0c;我旧电脑上安装的git版本是2.33.1版本&#xff0c;新电脑安装git的版本是2.43.0&#xff0c;这不妨碍迁移。 将git的全局配置文件从旧电脑拷贝到新电脑 Git的全局配置文件&…...

避坑指南:RT-Thread PM组件设备驱动注册与休眠唤醒的那些‘坑’(附I2C传感器实例)

RT-Thread PM组件实战避坑指南&#xff1a;从设备注册到唤醒的深度解析 在嵌入式低功耗开发领域&#xff0c;RT-Thread的PM组件堪称一把双刃剑——用得好能让设备续航翻倍&#xff0c;用不好则可能让开发者陷入无尽的调试泥潭。本文将聚焦I2C传感器等外设在实际应用中的典型问题…...

FedML模型服务平台实战:构建高可用推理服务的终极指南

FedML模型服务平台实战&#xff1a;构建高可用推理服务的终极指南 【免费下载链接】FedML FEDML - The unified and scalable ML library for large-scale distributed training, model serving, and federated learning. FEDML Launch, a cross-cloud scheduler, further enab…...

BetterGI完整使用手册:原神自动化工具终极指南

BetterGI完整使用手册&#xff1a;原神自动化工具终极指南 【免费下载链接】better-genshin-impact &#x1f4e6;BetterGI 更好的原神 - 自动拾取 | 自动剧情 | 全自动钓鱼(AI) | 全自动七圣召唤 | 自动伐木 | 自动刷本 | 自动采集/挖矿/锄地 | 一条龙 | 全连音游 | 自动烹饪…...

把 ABAP 变体真正用活,动态保存、加载与删除的一套做法

报表开发里,最容易被低估的一层能力 做 ABAP 报表开发时,我们几乎天天都在和选择屏幕打交道。航司、公司代码、过账日期、工厂、销售组织,这些条件输一次不难,难的是天天输、月月输、每个批作业都输一遍。SAP 里所谓的变体,也就是 variant,本质上就是把某一组选择条件保…...

【Java Loom响应式转型终极指南】:2026企业级落地的5大避坑法则与性能实测数据(JVM 21.0.4+ Project Loom GA深度验证)

第一章&#xff1a;Java Loom响应式转型的底层动因与2026企业级就绪度全景评估Java Loom 项目不再仅是协程&#xff08;Virtual Threads&#xff09;的语法糖&#xff0c;而是JVM运行时模型的一次范式跃迁——它重构了阻塞与非阻塞、线程与任务、同步与异步之间的边界。其核心动…...

短信验证码接口被刷如何防范?

短信验证码接口被刷如何防范&#xff1f; 在数字化时代&#xff0c;短信验证码已成为身份验证的重要手段&#xff0c;广泛应用于注册、登录、支付等场景。随着黑灰产技术的升级&#xff0c;短信验证码接口被恶意刷取的现象日益猖獗&#xff0c;不仅导致企业成本激增&#xff0…...

通用ADC芯片测试:其TSSOP16、QFN16封装与德诺嘉电子芯片测试座角色应用

在车规级电子&#xff08;如车载传感器、电池管理系统&#xff09;与医疗电子&#xff08;如便携式诊断设备、生命体征监测仪器&#xff09;领域&#xff0c;通用ADC&#xff08;模数转换&#xff09;芯片作为模拟信号与数字信号的“桥梁”&#xff0c;其性能直接决定设备的数据…...

React 多标签页同步:利用 SharedWorker 在多个 React 实例间共享持久化 WebSocket 连接

嘿&#xff0c;各位前端界的“码农”们&#xff0c;以及那些自认为“码农”但实际上只是“复制粘贴侠”的朋友们&#xff0c;大家好&#xff01;今天我们不聊那些花里胡哨的 CSS 动画&#xff0c;也不聊那些让你头发掉光的 TypeScript 泛型。今天&#xff0c;我们要聊聊一个稍微…...

Kaggle房价预测:用Pandas和Seaborn做数据分析,这10个坑新手最容易踩

Kaggle房价预测&#xff1a;数据分析新手避坑指南 第一次接触Kaggle的房价预测比赛时&#xff0c;我被数据里隐藏的陷阱绊倒了好几次。记得当时信心满满地提交了第一版预测结果&#xff0c;排名却惨不忍睹——问题就出在最基础的数据分析环节。这篇文章不是教你按部就班地做数据…...

别再硬编码了!用环境变量+路由参数动态管理H5导航栏(适配小程序web-view)

跨平台H5导航栏动态管理&#xff1a;环境变量与路由参数的工程化实践 在当今多端融合的开发环境下&#xff0c;H5页面经常需要同时适配原生App、微信小程序等多种平台。导航栏作为用户界面的核心交互元素&#xff0c;其在不同平台下的呈现方式往往成为开发痛点。传统硬编码的判…...