vant vue单张图片上传

上传组件

 <template #input><van-uploader accept="file" :max-count="1" v-model="photo" :after-read="afterPhoto" /></template>

data

data() {
    return {
    photo: [],}
},

事件绑定，组装成file文件

 afterPhoto(file) {
    const tempFile = file.fileconst type = tempFile.typeconst size = tempFile.sizeconst newName = new Date().getTime() + tempFile.namelet uploadFile = new File([tempFile], newName, {
    type,size})let formData = new FormData()formData.append('image', uploadFile)this.$axios.post(this.apiUrl + '/php/upload', formData).then((res) => {
    this.photo.url = this.apiUrl + res.data.data.image}).catch((err) => {
    console.log(err);});},