uniapp uview 图片上传

本文介绍了如何在uniApp中结合uView UI组件库实现图片上传功能,包括选择图片、预览、上传到服务器的步骤,同时讨论了前端图片压缩和文件类型校验的实现细节。
摘要由CSDN通过智能技术生成
<template>
	<view>
		<view class="li-price" @click="toggle('center')">
			上传处理照片
		</view>
		处理事故照片上传:
			<!--u-upload是uview的图片上传组件,里面写的是上传条件。-->
			<u-upload :max-size="5 * 1024 * 1024" max-count="3" min-count="3" ref="uUpload" :action="action" :auto-upload="true"></u-upload>
			<view class="button-bottom">
				<!--这一步是把图表保存在我们自己的服务器上-->
				<button style="background-color: #2E95FF;color: #FFFFFF;" @click="submit()">保存图片</button>
			</view>
	</view>
</template>


<script>
	export default {
		name: "upimage",
		data() {
		//可以通过设置file-list参数(数组,元素为对象),显示预置的图片。其中元素的url属性为图片路径
		//设置action参数为后端服务器地址,注意H5在浏览器可能会有跨域限制,让后端允许域即可
			return {
				action:'http://1.1111.1111.11111//image/image',//你的图片
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值