【uniapp】uview1.x使用upload上传图片

和2.x不同的是,要用 action 来配置后端上传图片的接口地址;
再来一些配置项的命名有所不同,一般1.x的命名用 -,2.x的命名使用小驼峰;
1.x 的上传会自带删除时的提示框,2.x 没有;

重要的几个配置项有:

<u-upload :file-list="picList" :action="baseUrl" :before-upload="beforeUpload":before-remove="beforeRemove"
></u-upload>

picList 初始化为一个空数组,是用来保存图片的列表
baseUrl 为后端上传图片的接口
beforeUpload 为图片上传之前的回调
beforeRemove 为图片删除之前的回调

这两个回调函数的参数皆为:indexlist,指当前的图片的下标和已有图片的列表
图片上传:

beforeUpload(index, list) {this.picList = []// console.log('list',list);list.map(async item => {this.picList.push({url: item.url})let result = await this.uploadFilePromise(item.url);console.log(result);})console.log('照片列表',this.picList);},// 上传图片uploadFilePromise(url) {return new Promise((resolve, reject) => {uni.uploadFile({// 仅为示例,非真实的接口地址url: `${BASE_URL}/api/pic/upload`,filePath: url,name: "file",formData: {typeEnum: "IMAGE",},success: (res) => {resolve(res.data);console.log(res);},});});},

照片列表打印结果:
在这里插入图片描述
上传成功的返回结果:
在这里插入图片描述
补充比较常用的:
max-count="9":用来设置最大可上传图片数量
:max-size="5 * 1024 * 1024" :用来单张图片可上传的大小

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

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

相关文章

银河集团香港优才计划95分获批案例展示!看看是如何申请的?

银河集团香港优才计划95分获批案例展示&#xff01;看看是如何申请的&#xff1f; 今天来分享一则银河集团香港优才计划获批案例&#xff01;客户本科学历非名校、从事业务支援及人力资源行业&#xff0c;优才打分95分&#xff0c;这个条件可能在很多人的印象里&#xff0c;会觉…

网课 - 网页视频-倍速播放-快进-拖动进度条-增大音量 - 火狐Firefox浏览器

本文使用的浏览器为火狐Firefox浏览器。 用浏览器播放视频&#xff0c;比如看网课、看在线电影电视剧时&#xff0c;经常能遇到的情况与解决方案&#xff1a; 音量太小&#xff0c;即使调整到100%还是不够响亮 这时可以安装插件“600% Sound Volume”, 安装之后可在原来音量的…

“2024杭州智慧城市展“汇集全球领先的智慧城市解决方案和前沿技术

2024杭州智慧城市展览会&#xff0c;将于2024年4月份在杭州国际博览中心盛大召开。此次展览会以智慧城市为主题&#xff0c;涵盖了智慧城市、信息安全、数据中心与通信、人工智能、公共安全、会议广播视讯、智慧社区与智能家居、智慧停车等八个模块&#xff0c;旨在推动互联网、…

Echats-自定义图表2

效果图&#xff1a; 代码&#xff1a; <!DOCTYPE html> <html lang"zh-cmn-Hans"><head><meta charset"UTF-8" /><meta name"viewport" content"widthdevice-width, initial-scale1.0" /><title>…

《C和指针》笔记35:结构体

本文整理一下结构体的相关知识&#xff0c;记录是为了更好地加深理解。 1. 结构体声明 下面两个声明语句&#xff1a; struct {int a;char b;float c; } x;struct {int a;char b;float c; } y[20], *z;这两个声明被编译器当作两种截然不同的类型&#xff0c;即使它们的成员列…

批量拍摄剪辑短视频,这几个实用又简单的拍摄技巧可以收藏学习

现在越来越多的朋友都当起了视频博主&#xff0c;自己来拍短视频&#xff0c;但说来简单&#xff0c;到了拍摄的时候&#xff0c;却有些无从下手&#xff0c;直接拿起手机就拍吗&#xff1f;是不是太平淡了&#xff1f;可自己又不会专业的拍摄技巧啊~ 今天来分享4个简单的拍摄…

Guava-RateLimiter详解

简介&#xff1a; 常用的限流算法有漏桶算法和令牌桶算法&#xff0c;guava的RateLimiter使用的是令牌桶算法&#xff0c;也就是以固定的频率向桶中放入令牌&#xff0c;例如一秒钟10枚令牌&#xff0c;实际业务在每次响应请求之前都从桶中获取令牌&#xff0c;只有取到令牌的请…

Apache ActiveMQ RCE漏洞复现(CNVD-2023-69477)

0x01 产品简介 ActiveMQ是一个开源的消息代理和集成模式服务器&#xff0c;它支持Java消息服务(JMS) API。它是Apache Software Foundation下的一个项目&#xff0c;用于实现消息中间件&#xff0c;帮助不同的应用程序或系统之间进行通信。 0x02 漏洞概述 Apache ActiveMQ 中存…

计算机视觉 计算机视觉识别是什么?

计算机视觉识别&#xff08;Computer Vision Recognition&#xff09;是计算机科学和人工智能领域中的一个重要分支&#xff0c;它致力于使计算机系统能够模拟和理解人类视觉的过程&#xff0c;从而能够自动识别、分析和理解图像或视频中的内容。这一领域的发展旨在让计算机具备…

系列三十五、Spring AOP失效原因以及解决方式

一、Spring AOP失效原因 &#xff08;1&#xff09;内部调用不会触发AOP&#xff1b; &#xff08;2&#xff09;方法是private修饰的&#xff0c;AOP会失效&#xff1b; 解决方法&#xff1a;改成public &#xff08;3&#xff09;目标类没有配置为bean&#xf…

数据结构——线性表①(顺序表)

一、线性表定义 线性表是一种数据结构&#xff0c;它是由n个具有相同数据类型的数据元素a1,a2,…,an组成的有限序列。 其中&#xff0c;除第一个元素a1外&#xff0c;每一个元素有且只有一个直接前驱元素&#xff0c;除了最后一个元素an外&#xff0c;每一个元素有且只有一个…

云原生-AWS EC2使用、安全性及国内厂商对比

目录 什么是EC2启动一个EC2实例连接一个实例控制台ssh Security groups规则默认安全组与自定义安全组 安全性操作系统安全密钥泄漏部署应用安全元数据造成SSRF漏洞出现时敏感信息泄漏网络设置错误 厂商对比参考 本文通过实操&#xff0c;介绍了EC2的基本使用&#xff0c;并在功…

关于ABB 机器人多任务的建立

关于ABB 机器人多任务的建立.需要实时监控某一区域&#xff0c;或者某一信号&#xff0c;或者计件到达某一数量机器人自动停止报警&#xff0c;显示到示教器上&#xff0c;多任务可以实现&#xff0c;类似发那科机器人后台逻辑指令 当软件选项漏选或者少选可以选择修改选项&…

近期面试小结

作者&#xff1a;究极逮虾户 最近面试了不少的公司&#xff0c;行情整体来说还是非常差的&#xff0c;如果没有必要不建议大家裸辞&#xff0c;另外就不总结面试的题目了。这次打算着重从项目经验上来给大家讨论下&#xff0c;我觉得这部分可能才是面试中得分比重比较大的部分&…

C的缺陷和陷阱读书笔记

词法陷阱 1、if语句的特殊用法 1、if(x>max) maxx;2、if(x>max?x;max) //条件表达式&#xff0c;是执行第二个&#xff0c;否执行第三个3、if(x>max); //条件成立后执行——空语句4、if((fopen(arg v[i],0))>0) //open函数执行&#xff0c;成功返回后面的0&a…

处理大数据的基础架构,OLTP和OLAP的区别,数据库与Hadoop、Spark、Hive和Flink大数据技术

处理大数据的基础架构&#xff0c;OLTP和OLAP的区别&#xff0c;数据库与Hadoop、Spark、Hive和Flink大数据技术 2022找工作是学历、能力和运气的超强结合体&#xff0c;遇到寒冬&#xff0c;大厂不招人&#xff0c;可能很多算法学生都得去找开发&#xff0c;测开 测开的话&am…

前端的简单介绍

前端核心的分析 CSS语法不够强大&#xff0c;比如无法嵌套书写&#xff0c;倒是模块化开发中需要书写很多重复的选择器 没有变量和合理的样式复用机制&#xff0c;使逻辑上相关的属性值必须字面量的心事重复的输出&#xff0c;导致难以维护 CSS预处理器,减少代码的笨重&#…

DNS 域名解析系统

文章目录 前言什么是 DNS 域名解析系统为什么需要 DNS 域名解析DNS 是如何发展的hosts 文件维护域名和IP的映射关系DNS 系统&#xff08;服务器&#xff09;DNS 镜像系统 前言 前面为大家分享了关于计算机网络中应用层——自定义协议、传输层——UDP、TCP 协议、网络层——IP协…

pgsql 分组查询,每组取10条

需求&#xff1a; 按照表的字段分组&#xff0c;然后每组取10条结果&#xff0c;返回即可 sql 如下&#xff1a; SELECT* FROM (SELECT chk_id,feature_id,task_id, ROW_NUMBER () OVER (PARTITION BY chk_id ORDER BY chk_id) AS row_num FROM ics_check_report WHERE task…

肺癌不再是老年病:33岁作家的离世引发关注,有这些情况的请注意

近期&#xff0c;90后网络小说家七月新番和26岁男艺人蒋某某因肺癌去世&#xff0c;引发关注。他们都没有吸烟习惯&#xff0c;那么他们为什么会得肺癌呢&#xff1f;浙大二院呼吸内科副主任医师兰芬说&#xff0c;现在年轻人熬夜、加班导致身体过劳&#xff0c;在劳累情况下身…