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

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

相关文章

Centos如何安装Mysql

1、安装前检查是否存在mysql yum list installed mysql* ①如或显示了列表&#xff0c;说明系统中有MySQL **yum卸载 ** 根据列表上的名字&#xff08;[中括号为可选项]&#xff09; yum remove [填写列表显示出来的所有内容] rm -rf /var/lib/mysql rm /etc/my.cnf②rpm查…

【Qt之QLocale】使用

描述 QLocale类可以在多种语言之间进行数字和字符串的转换。 QLocale类在构造函数中使用语言/国家对进行初始化&#xff0c;并提供类似于QString中的数字转字符串和字符串转数字的转换函数。 示例&#xff1a; QLocale egyptian(QLocale::Arabic, QLocale::Egypt);QString s1 …

证照之星XE专业版下载专业证件照制作工具

值得肯定的是智能背景替换功能&#xff0c;轻松解决背景处理这一世界难题。不得不提及的是新增打印字体设置&#xff0c;包含字体选择、字号大小、字体颜色等。不同领域的应用证明了万能制作&#xff0c;系统支持自定义证照规格&#xff0c;并预设了17种常用的证件照规格。人所…

c语言练习(9周)

输入样例11输出样例7.0980 #include<stdio.h> int main() {int n, i;double s 1,a1;scanf("%d", &n);for (i 2; i < n; i) {a 1 / (1a);s a;}printf("%.4lf", s);return 0; } 题干输入10个整数&#xff0c;分别按输入正序、逆序显示。输…

2021-arxiv-LoRA Low-Rank Adaptation of Large Language Models

2021-arxiv-LoRA Low-Rank Adaptation of Large Language Models Paper: https://arxiv.org/abs/2106.09685 Code: https://github.com/microsoft/LoRA 大型语言模型的LoRA低秩自适应 自然语言处理的一个重要范式包括对通用领域数据的大规模预训练和对特定任务或领域的适应。…

IOI车机系统刷机和改包笔记2 - 改包脚本

前言&#xff1a; 最近对雪佛兰改包需求感兴趣的网友很多&#xff0c;大家都遇上了很多奇怪的问题&#xff0c;这里就我自己使用的环境和脚本进行分享&#xff0c;供大家参考。 1. 准备环境 我这里使用Ubuntu系统进行操作 andyandy-vm:~$ sudo lsb_release -a No LSB module…

iZotope RX 10(音频修复和增强工具)

iZotope RX 10是一款音频修复和增强软件&#xff0c;主要特点包括&#xff1a; 声音修复&#xff1a;iZotope RX 10可以去除不良噪音、杂音、吱吱声等&#xff0c;使音频变得更加清晰干净。音频增强&#xff1a;iZotope RX 10支持对音频进行音量调节、均衡器、压缩器、限制器等…

如何在【逻辑回归】中优化控制正则化程度的超参数C

一.逻辑回归基本介绍 逻辑回归也称作logistic回归&#xff0c;是一种广义的线性回归分析模型&#xff0c;主要是用来解决二分类问题&#xff08;也可以解决多分类问题&#xff09;。通过训练集来训练模型&#xff0c;并在训练结束后对测试集进行分类。 通过激活函数&…

杂货铺 | 报错记录(持续更新)

文章目录 ⚠️python SyntaxError: Non-UTF-8 code starting with ‘\xb3‘ in file⚠️partially initialized module ‘‘ has no attribute ‘‘(most likely due to a circular import)⚠️AttributeError: ‘DataFrame‘ object has no attribute ‘append‘ ⚠️python S…

Flink CDC 2.0 主要是借鉴 DBLog 算法

DBLog 算法原理 DBLog 这个算法的原理分成两个部分&#xff0c;第一部分是分 chunk&#xff0c;第二部分是读 chunk。分 chunk 就是把一张表分为多个 chunk&#xff08;桶/片&#xff09;。我可以把这些 chunk 分发给不同的并发的 task 去做。例如&#xff1a;有 reader1 和 re…

springboot是如何工作的

一、前言 现在java后端开发框架比较多的使用springboot框架&#xff0c;springboot是在以前的springMVC进行封装和优化&#xff0c;最大的特点是简化了配置和内置Tomcat。本节通过阅读源码理解springboot是如何工作的。 二、springboot是如何工作的 1、从启动类开始 /***服务…

JAVA毕业设计107—基于Java+Springboot+Vue的民宿酒店预订管理系统(源码+数据库)

基于JavaSpringbootVue的民宿酒店预订管理系统(源码数据库)107 一、系统介绍 本系统前后端分离 本系统分为用户、前台、管理员三种角色(角色菜单可以自行分配) 前台&#xff1a; 登录、注册、民宿浏览、民宿评价、民宿酒店下单预订、密码修改、个人信息修改。 管理后台&…

机泵设备如何通过设备健康管理平台实施预测性维护

机泵设备在工业生产中起着至关重要的作用&#xff0c;但长时间运行和频繁使用容易引发各种故障。为了提高机泵设备的可靠性和效率&#xff0c;预测性维护成为一种重要的管理策略。设备健康管理平台作为一种先进的工具&#xff0c;为机泵设备的预测性维护提供了有力支持。本文将…

NlogPrismWPF

文章目录 Nlog&Prism&WPF日志模块实现原理添加配置注入服务应用测试其他模块怎么调用&#xff1f; Nlog&Prism&WPF 日志模块 介绍了为WPF框架Prism注册Nlog日志服务的方法 实现原理 无论是在WPF或者ASP.NET Core当中, 都可以使用ServiceCollection来做到着…

【HarmonyOS】鸿蒙操作系统架构

HarmonyOS架构 一. 鸿蒙系统定位二. 架构整体遵从分层设计三. HarmonyOS具有的技术特性四. HarmonyOS有三大特征 其它相关推荐&#xff1a; 软考系统架构之案例篇(架构设计相关概念) 系统架构之微服务架构 系统架构设计之微内核架构 所属专栏&#xff1a;系统架构设计师 一. 鸿…

在excel中如何打出上标、下标

例如&#xff0c;想把A2的2变为下标。 在单元中输入内容&#xff1a; 选中2&#xff1a; 右键单击&#xff0c;然后点击“设置单元格格式”&#xff1a; 在特殊效果的下面勾选“下标”&#xff0c;然后点击下面的“确定”按钮&#xff1a; 就将2变为下标了&#xff1a;…

竞赛选题 深度学习图像风格迁移 - opencv python

文章目录 0 前言1 VGG网络2 风格迁移3 内容损失4 风格损失5 主代码实现6 迁移模型实现7 效果展示8 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 深度学习图像风格迁移 - opencv python 该项目较为新颖&#xff0c;适合作为竞赛课题…

Go Map底层实现简述

Go的map是一种高效的数据结构&#xff0c;用于存储键值对。其底层实现是一个哈希表&#xff08;hash table&#xff09;&#xff0c;下面是有关map底层实现的详细介绍&#xff1a; 哈希表&#xff1a; map的底层实现是一个哈希表&#xff0c;也称为散列表。哈希表是一个数组&a…

13.7性能测试工具(LoadRunner)(简单扫盲)

下载LoadRunner和360极速浏览器 一.为什么选择LoadRunner而不是Jmeter 1.Jmeter没有录制功能. 2.LoadRunner可以设计非常丰富的测试场景. 3.LoadRunner能够产出非常丰富的测试报告. 二.LoadRunner三大组件 1.VUG: 功能: 录制脚本(编写脚本). 2.Controller: 功能: 设计场…

2021年06月 Python(二级)真题解析#中国电子学会#全国青少年软件编程等级考试

Python等级考试(1~6级)全部真题・点这里 一、单选题(共25题,每题2分,共50分) 第1题 执行下列代码后,运行结果是? seq=[hello,good,morning] s=*.join(seq