vue+vant Uploader base64上传图片，预览、上传、处理过（后台处理）的图片（旋转、模糊、裁剪...）

<van-uploader v-model="uploadList" :after-read="process"/>取上传列表中图片的数据 base64数据//取上传列表中图片的数据 base64数据uploadList[0].content.replace(/^data:image\/\w+;base64,/, '');

射手男很懒

5171人浏览 · 2020-11-23 13:39:18

射手男很懒 · 2020-11-23 13:39:18 发布

<van-uploader v-model="uploadList" :after-read="process"/>

uploadList为数组

取上传列表中图片的数据 base64数据

//取上传列表中图片的数据 base64数据
let imgbase64 = uploadList[0].content.replace(/^data:image\/\w+;base64,/, '');
//这个是传给后台要处理的base64数据
this.$nextTick(() => {					
    this.$set(this.uploadList.length - 1], 'content', 'data:image/jpeg;base64,' + 后台处理后        
    图片base64数据)
})
//多图上传请自行处理

现在列表就是处理过后的数据了，预览也是修改后的图片

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^