springboot+uniapp上传图片

<view class="cu-form-group"><view class="title">特种作业证照：</view><view class='upload-image-view'><!-- 标题已经省略 --><!-- <view class='title'>上传xxxx图片</view> --><block v-for="(image,index) in LicenseImageList" :key="index"><view class='image-view'><image :src="data:image" :data-src="data:image" @tap="previewLicenseImage"></image><view class='del-btn' :data-index="index" @tap='deleteLicenseImage'><view class='baicha'></view></view></view></block><view class='add-view' v-if="LicenseImageList.length < imageLength" @tap="chooseLicenseImage"><!-- 相机 --><!-- <view class="xiangji"><view class="tixing"></view><view class='changfx'><view class='yuan1'><view class='yuan2'></view></view></view></view> --><!-- 十字架 --><view class="cross"><view class="transverse-line"></view><view class="vertical-line"></view></view></view></view>
</view>

//特种作业证照-选择图片
chooseLicenseImage: async function() {uni.chooseImage({sourceType: sourceType[this.sourceTypeIndex],// #ifdef MP-WEIXINsizeType: sizeType[this.sizeTypeIndex],// #endifcount: this.imageLength - this.LicenseImageList.length,success: (res) => {const tempFilePaths = res.tempFilePaths[0];api.uploadFile({url: 'uploadFail/upload',filePath: tempFilePaths,name: 'file',success: (uploadFileRes) => {this.LicenseImageList = [uploadFileRes.url];}});}})
},
//特种作业证照--预览图片
previewLicenseImage: function(e) {var current = e.target.dataset.srcuni.previewImage({current: current,urls: this.LicenseImageList})
},
//特种作业证照--删除图片
deleteLicenseImage: function(e) {var index = e.target.dataset.index;var that = this;var images = that.LicenseImageList;images.splice(index, 1);that.LicenseImageList = images;
},

@RestController
@RequestMapping("/api/uploadFail")
@Validated
public class UploadFileController {@Autowiredprivate ServerConfig serverConfig;/*** 通用上传请求*/@PostMapping("upload")public AjaxResult uploadFile(MultipartFile file) throws Exception{try{// 上传文件路径String filePath = RuoYiConfig.getUploadPath();// 上传并返回新文件名称String fileName = FileUploadUtils.upload(filePath, file);String url = serverConfig.getUrl() + fileName;AjaxResult ajax = AjaxResult.success();ajax.put("fileName", fileName);ajax.put("url", url);return ajax;}catch (Exception e){return AjaxResult.error(e.getMessage());}}
}

springboot+uniapp上传图片相关推荐

uni-app上传图片到腾讯云
uni-app上传图片到腾讯云(对象存储) 客户端,先从后端请求到上传的链接,再直接上传图片到腾讯云的对象存储. 1.文件base-util.js的内容: function chooseImageFr ...
springboot+uniapp实现简单注册登录
springboot+uniapp实现简单注册登录前言后端新建springboot项目配置数据库建表,写对应类写接口,写对应xml文件封装返回信息,封装UUID Service层 Con ...
uniapp 上传图片到华为云obs
记录一下用uniapp上传图片到华为云obs,之前是先把文件传到我们自己的服务器,然后后端的同事再上传到obs,但是我们公司的带宽太低了,传的太太太太慢了,于是考虑直接让用户上传到obs,不经过我们自 ...
SpringBoot + uniApp实现的掌上生鲜超市购物微信小程序系统附带详细运行指导视频
项目描述:这是一个基于SpringBoot+uniApp框架开发的掌上生鲜超市购物微信小程序系统.首先,这是一个前后端分离的项目,前端分为用户端和管理端,用户端使用微信小程序(uniApp开发),管理 ...
uni-app上传图片并添加水印
uni-app上传图片并添加水印: 效果: image-picker 组件使用: <template><view><ImagePicker v-model="i ...
uni-app 上传图片到七牛云
uni-app 上传图片到七牛云我的流程是:在上传图片到七牛之前,先调后端提供的接口获取token.key等,然后通过uni.uploadFile把token.key传给七牛: token:从后端获 ...
uniapp上传图片
uniapp上传图片文章目录 uniapp上传图片选择图片上传图片使用相关数据效果图选择图片这里定义js文件 export default {/*** 选择图片* @param numb ...
停车系统源码-基于springboot+uniapp前后端完全开源的多终端智慧停车场系统源码
一.项目简介基于springboot+uniapp前后端完全开源的多终端智慧停车场系统源码,不存在任何私有jar. 停车场系统源码,停车源码,停车系统源码 1.功能 (1)兼容各种相机,可以根据自己 ...
springboot+uniapp授权登录+jsapi支付
SpringBoot+uniapp+jsapi微信支付,找了了好久资料,自己记录一下 1. 申请小程序并认证 1) 获取AppID和AppSecret 2) 配置服务器域名 3) 关联商户号 2.申请 ...
基于springboot+uniapp+vue3技术栈开发的开源跨平台小程序
塔可商城, 一个基于springboot+uniapp+vue3技术栈开发的开源跨平台小程序.管理后台,后端服务的项目,它内置提供了会员分销, 区域代理, 商品零售等功能的新零售电商系统.强大弹性的架 ...

springboot+uniapp上传图片

springboot+uniapp上传图片相关推荐

最新文章

热门文章