uniapp uview1.0 页面多个upload上传、回显之后处理数据

uniapp uview1.0 页面多个upload上传、回显之后处理数据_第1张图片

商品图片



商品详情图片

html结构如上,定义两种ref  'images'  ,'content' 

在提交的时候将两种ref形成数组进行循环

subClick(){
  ['images','content'].map(item=>{
					this.getImg(item)
	})
}

处理数据

getImg(refText) {
                 //refText为自己 定义的ref
				let files = [];
				// 通过filter,筛选出上传进度为100的文件(因为某些上传失败的文件,进度值不为100,这个是可选的操作)
				files = this.$refs[refText].lists.filter(val => {
					return val.progress == 100;
				})
				if(refText=='images' && files.length==0){
					this.$refs.uToast.show({
						title: '请上传商品图片',
						type: 'error'
					})
					return
				}
				
				if(refText=='content' && files.length==0){
					this.$refs.uToast.show({
						title: '请上传商品详情图片',
						type: 'error'
					})
					return
				}
				let ids=[]
				files.map(item=>{
                  //在这里判断出是否为回显上去的图片,我拿出来的是图片id
					if(item.file_id){
						ids.push(item.file_id)
					}else{
						ids.push(item.response.data.file_id)
					}
				})
              //赋值给自己的数据
				this.skuQuery[refText]=ids.join(',')
			},

关于另外一个upload循环问题在这​​​​​​​

你可能感兴趣的:(uni-app)