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

uView1.0的Upload组件上传图片

<template><u-uploadref="uUpload":file-list="fileList"accept="image/jpeg,image/png"    //允许选择图片文件:sizeType="sizeType":max-size="2 * 1024 * 1024"    //限制上传的图片文件最大为 2M@oversize="oversize"@on-remove="deleteImgs"    //移除:auto-upload="false"    //禁止自动上传选择的图片文max-count="9"     //限制最多只能选择几个图片文件       :show-progress="false"     //不显示文件上传进度条multiple    //多图:previewFullImage="true"    //预览图片时显示完整的原图@on-choose-complete="onChooseComplete">
</u-upload>
</template>
<script>export default {data() {return {fileList: [], //文件列表}},methods: {// 文件超出大小限制oversize() {uni.showToast({title: "图片最大不能超过2M",icon: 'none'})},onChooseComplete(event) {this.multipleUpload(this.$refs.uUpload.lists, 2)},// 多张图片上传multipleUpload(event, type) {let num = 9;event.map(item => {if (num === event.length) {uni.showToast({title: '最多上传9张图片',icon: 'none'})return}num += 1this.uploadDo(item, type)})},uploadDo(event, type) {uni.uploadFile({url: "http://192.168.2.105:18100/file/uploadFile",//仅为示例,非真实的接口地址filePath: event.file.path,name: "file",header: {Authorization: `Bearer  +uni.getStorageSync("token")`,},success: (res) => {let resp = JSON.parse(res.data);this.form.voucherPictureUrls.push(resp.data);},});},//删除图片deleteImgs(index, lists, name) {},}
</script>

uploadDo(event, type) {

   console.log(event, "event");        //上传图片事件
      uni.uploadFile({
        url: "http://192.168.2.105:18100/file/uploadFile",//仅为示例,非真实的接口地址
        filePath: event.file.path,
        name: "file",
        header: {
          Authorization: `Bearer  +uni.getStorageSync("token")`, //要添加header否则接口不能调用
        },
        success: (res) => {

         console.log(res, "res");

          //如果上传成功打印下res,看有没有调用接口以及图片上传回显
          let resp = JSON.parse(res.data);
          this.form.voucherPictureUrls.push(resp.data);
        },
      });
    },

相关文章:

uView1.0的Upload组件上传图片

<template><u-uploadref"uUpload":file-list"fileList"accept"image/jpeg,image/png" //允许选择图片文件:sizeType"sizeType":max-size"2 * 1024 * 1024" //限制上传的图片文件最大为 2Moversize"over…...

【LeetCode题目详解】第九章 动态规划part03 343. 整数拆分 96.不同的二叉搜索树 (day41补)

本文章代码以c为例&#xff01; 一、力扣第343题&#xff1a;整数拆分 题目&#xff1a; 给定一个正整数 n &#xff0c;将其拆分为 k 个 正整数 的和&#xff08; k > 2 &#xff09;&#xff0c;并使这些整数的乘积最大化。 返回 你可以获得的最大乘积 。 示例 1: 输…...

半导体制造常用软件工具总结

半导体制造常用软件工具总结 CIM&#xff1a;Computer Integrated Manufacturing 设备自动化&#xff0c;总称MES&#xff1a;Manufacturing Execution System 制造执行系统EAP&#xff1a;Equipment Automation Programming 设备自动化&#xff0c;是MES与设备的桥梁APC&…...

基于Python的IOS自动化测试环境搭建

文章目录 一、测试架构介绍1.1 WebDriverAgent原理分析1.2 tidevice原理分析二、环境安装2.1 iOS 设备安装 WebDriverAgent2.2 安装iTunes2.3 安装tidevice2.4 安装facebook-wda自动化三、操作流程四、Weditor的安装和使用一、测试架构介绍 以下为测试架构原理图 手机端的WDA…...

技术领导力实战笔记25

25&#xff5c;用心做好“鼓励式”管理 激发正能量 授权 分工作&#xff1a; 老人干新事&#xff0c;新人干老事&#xff0c;强者干难事&#xff0c;弱者干细事 新人干老事 所谓新人&#xff0c;是对业务产品不了解&#xff0c;对工作流程不清晰的岗位新人。对于新人来说&…...

设计模式-职责链+反射

文章目录 前言简单版本的职责链加反射职责链反射思路过程总结 前言 最近学习设计模式对于职责链的学习有了一些深入的了解故此有了这篇博客 简单版本的职责链加反射 职责链模式&#xff08;Chain of Responsibility Pattern&#xff09;和反射&#xff08;Reflection&#x…...

Middleware ❀ Kafka功能与使用详解

文章目录 1. 概述1.1. 消息队列1.2. 应用场景1.3. 工作模式1.4. 基础结构1.4.1. 结构组件1.4.2. 数据同步1.4.3. ACK机制1.4.4. 分区机制1.4.4.1. 使用Partition Key写入1.4.4.2. 轮询写入 - 默认规则1.4.4.3. 指定Partition写入 1.4.5. Offset偏移量1.4.5.1. 消息顺序性1.4.5.…...

python3.11教程1:python基础语法、程序控制、函数

文章目录 一、Python简介1.1 为什么学习python1.2 python安装与配置1.3 python解释器1.4 命令行参数1.4.1 sys.argv变量1.4.2 -c和-m选项 1.5 解释器的运行环境1.5.1 编码格式1.5.2 编码声明 二、Python基础语法2.1 行结构2.2 变量&#xff08;标识符&#xff09;2.3 字节串2.4…...

【C++】关于using namepace xxx 使用命名空间和冲突

官方定义 namespace是指 标识符的各种可见范围。命名空间用关键字namespace来定义。 命名空间是C的一种机制&#xff0c;用来把单个标识符下的大量有逻辑联系的程序实体组合到一起。此标识符作为此组群的名字。 基本使用 编译及执行命令&#xff1a; g test.cpp -o test ./…...

Linux常用命令——cupsenable命令

在线Linux命令查询工具 cupsenable 启动指定的打印机 补充说明 cupsenable命令用于启动指定的打印机。 语法 cupsenable(选项)(参数)选项 -E&#xff1a;当连接到服务器时强制使用加密&#xff1b; -U&#xff1a;指定连接服务器时使用的用户名&#xff1b; -u&#xff…...

基于Stable Diffusion的AIGC服饰穿搭实践

本文主要介绍了基于Stable Diffusion技术的虚拟穿搭试衣的研究探索工作。文章展示了使用LoRA、ControlNet、Inpainting、SAM等工具的方法和处理流程&#xff0c;并陈述了部分目前的实践结果。通过阅读这篇文章&#xff0c;读者可以了解到如何运用Stable Diffusion进行实际操作&…...

【 ARMv9 Cluster BUS QoS 配置】

文章目录 ARM Cluster QoS ARM Cluster QoS QoS&#xff08;Quality of Service&#xff0c;服务质量&#xff09;在 ARM 架构中&#xff0c;主要指的是一种机制&#xff0c;它可以控制和管理系统资源&#xff08;如内存、总线带宽等&#xff09;的使用&#xff0c;以满足各种…...

简单了解网络基本概念

目录 一、网络含义 二、什么是以太网&#xff1f; 三、网络分类 四、网络架构 五、数据传输方式 六、双工模式 一、网络含义 在实际生活中我们用传输介质把独立的终端设备相互连接起来就构成了网络。 二、什么是以太网&#xff1f; 以太网是一种网络通信协议标准&#…...

网络安全知识库

0x00 前言 本篇用来整理所有的零散的知识&#xff0c;作为一个技能树或者技能表来进行引导 CTF 加解密合集CTF Web合集 0x01 Http 1.http头 1.1 本地访问识别 如何伪造http头&#xff0c;让后端认为是本地访问...

无涯教程-JavaScript - FLOOR函数

描述 FLOOR函数将数字向下舍入为零,直到最接近的有效倍数。 语法 FLOOR (number, significance)争论 Argument描述Required/OptionalNumberThe numeric value you want to round.RequiredSignificanceThe multiple to which you want to round.Required Notes 如果数字的符…...

【LeetCode-中等题】146. LRU 缓存

文章目录 题目方法一&#xff1a;直接继承LinkedHashMap调用api方法二&#xff1a;自定义LinkedHashMap HashMap ListNode LinkedHashMap 题目 LRU缓存是什么&#xff1a;LRU缓存机制&#xff0c;你想知道的这里都有 实现 LRU 缓存算法 方法一&#xff1a;直接继承Linked…...

表白墙程序

目录 一、页面代码部分 二、设计程序 二、实现 doPost​编辑 三、实现 doGet 四、前端代码部分 五、使用数据库存储数据 一、页面代码部分 在之前的一篇博客中&#xff0c;已经写过了表白墙的页面代码实现&#xff0c;这里就不再重复了 页面代码如下&#xff1a; <!…...

git 本地仓库关联到远程仓库

将本地仓库关联到远程仓库 方式一&#xff1a;远程仓库没有文件 第一步&#xff1a; git init&#xff08;初始化git仓库&#xff09; 第二步&#xff1a; git remote add 地址&#xff08;设置remote地址&#xff09; 第三步&#xff1a; git add . &#xff08;将所有变…...

Introducing Language Guidance in Prompt-based Continual Learning

本文是LLM系列文章&#xff0c;针对《Introducing Language Guidance in Prompt-based Continual Learning》的翻译。 基于提示的持续学习中引入语言指导 摘要1 引言2 相关工作3 背景4 基于提示的持续学习语言指导5 实验6 结论 摘要 持续学习旨在学习一系列任务的单一模型&am…...

Matlab(数值微积分)

目录 1.多项式微分与积分 1.1 微分 1.2 多项式微分 1.3 如何正确的使用Matlab? 1.3.1 Matlab表达多项式 1.3.2 polyval() 多项式求值 1.3.3 polyder()多项式微分 1.4 多项式积分 1.4.1 如何正确表达 1.4.2 polyint() 多项式积分 2.数值的微分与积分 2.1 数值微分 2…...

idea大量爆红问题解决

问题描述 在学习和工作中&#xff0c;idea是程序员不可缺少的一个工具&#xff0c;但是突然在有些时候就会出现大量爆红的问题&#xff0c;发现无法跳转&#xff0c;无论是关机重启或者是替换root都无法解决 就是如上所展示的问题&#xff0c;但是程序依然可以启动。 问题解决…...

css实现圆环展示百分比,根据值动态展示所占比例

代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...

DockerHub与私有镜像仓库在容器化中的应用与管理

哈喽&#xff0c;大家好&#xff0c;我是左手python&#xff01; Docker Hub的应用与管理 Docker Hub的基本概念与使用方法 Docker Hub是Docker官方提供的一个公共镜像仓库&#xff0c;用户可以在其中找到各种操作系统、软件和应用的镜像。开发者可以通过Docker Hub轻松获取所…...

解锁数据库简洁之道:FastAPI与SQLModel实战指南

在构建现代Web应用程序时&#xff0c;与数据库的交互无疑是核心环节。虽然传统的数据库操作方式&#xff08;如直接编写SQL语句与psycopg2交互&#xff09;赋予了我们精细的控制权&#xff0c;但在面对日益复杂的业务逻辑和快速迭代的需求时&#xff0c;这种方式的开发效率和可…...

安卓基础(aar)

重新设置java21的环境&#xff0c;临时设置 $env:JAVA_HOME "D:\Android Studio\jbr" 查看当前环境变量 JAVA_HOME 的值 echo $env:JAVA_HOME 构建ARR文件 ./gradlew :private-lib:assembleRelease 目录是这样的&#xff1a; MyApp/ ├── app/ …...

Mysql8 忘记密码重置,以及问题解决

1.使用免密登录 找到配置MySQL文件&#xff0c;我的文件路径是/etc/mysql/my.cnf&#xff0c;有的人的是/etc/mysql/mysql.cnf 在里最后加入 skip-grant-tables重启MySQL服务 service mysql restartShutting down MySQL… SUCCESS! Starting MySQL… SUCCESS! 重启成功 2.登…...

苹果AI眼镜:从“工具”到“社交姿态”的范式革命——重新定义AI交互入口的未来机会

在2025年的AI硬件浪潮中,苹果AI眼镜(Apple Glasses)正在引发一场关于“人机交互形态”的深度思考。它并非简单地替代AirPods或Apple Watch,而是开辟了一个全新的、日常可接受的AI入口。其核心价值不在于功能的堆叠,而在于如何通过形态设计打破社交壁垒,成为用户“全天佩戴…...

【Linux】自动化构建-Make/Makefile

前言 上文我们讲到了Linux中的编译器gcc/g 【Linux】编译器gcc/g及其库的详细介绍-CSDN博客 本来我们将一个对于编译来说很重要的工具&#xff1a;make/makfile 1.背景 在一个工程中源文件不计其数&#xff0c;其按类型、功能、模块分别放在若干个目录中&#xff0c;mak…...

用神经网络读懂你的“心情”:揭秘情绪识别系统背后的AI魔法

用神经网络读懂你的“心情”:揭秘情绪识别系统背后的AI魔法 大家好,我是Echo_Wish。最近刷短视频、看直播,有没有发现,越来越多的应用都开始“懂你”了——它们能感知你的情绪,推荐更合适的内容,甚至帮客服识别用户情绪,提升服务体验。这背后,神经网络在悄悄发力,撑起…...

Linux基础开发工具——vim工具

文章目录 vim工具什么是vimvim的多模式和使用vim的基础模式vim的三种基础模式三种模式的初步了解 常用模式的详细讲解插入模式命令模式模式转化光标的移动文本的编辑 底行模式替换模式视图模式总结 使用vim的小技巧vim的配置(了解) vim工具 本文章仍然是继续讲解Linux系统下的…...