vant 图片上传以及修改

<template>
	<div>
		<van-uploader v-model="fileList" multiple :max-count="6" />
		<div @click="upimg">
			<div>上传</div>
		</div>
	</div>
</template>
<script>
import { batchUpload } from "@/api/http";//多图片上传图片接口
export default {
	data() {
		return {
			fileList: [],
			img: [],
			resimg: [
				"https://www.0551cx.com/publicFileUpload/basicGovernance/mobile/42a3d894-8563-4aab-b8ee-4cee224e1385.png",
				"https://www.0551cx.com/publicFileUpload/basicGovernance/mobile/7a433b7c-a8dd-4e5f-ad70-214aadd11a26.png",
				"https://www.0551cx.com/publicFileUpload/basicGovernance/mobile/4f69a82f-fb81-4ce8-9ba4-e876565e8c5e.jpg",
				"https://www.0551cx.com/publicFileUpload/basicGovernance/mobile/89c7b153-760d-4cdb-b5af-eea5ec913ec0.png",
				"https://www.0551cx.com/publicFileUpload/basicGovernance/mobile/2978e090-d2e1-4d27-b932-a82361e33472.png",
				"https://www.0551cx.com/publicFileUpload/basicGovernance/mobile/111f2ff5-cd5a-4afb-ae69-ce57c527f844.png",
			],
		};
	},

	methods: {
		async upimg() {
			let fd = new FormData();
			this.fileList.forEach((element) => {
				fd.append("files", element.file);
			});
			fd.append("filePath", "/basicGovernance/mobile");
			let res = await batchUpload(fd); //batchUpload为图片上传接口
			res.details.data.forEach((a) => {
				this.img.push(a.filePath);
			});
			this.fileList.forEach((item) => {
				if (item.url) {
					this.img.push(item.url);
				}
			});
			console.log(this.img);
		},
	},
	created() {
		this.resimg.forEach((element) => {
			this.fileList.push({
				url: element,
			});
		});
	},
};
</script>

</script>