jkzdzx_wjwapp/pages/shangchuan.vue

<template>
	<view>
		<!-- 上传文件组件 -->
		<u-upload :action="uploadUrl" :file-list="fileList" @after-read="afterRead" @oversize="onOversize"
			@delete="onDelete"></u-upload>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 上传文件的服务器地址
				uploadUrl: 'https://your-upload-api.com/upload',
				// 文件列表
				fileList: [],
			};
		},
		methods: {
			// 文件读取后的钩子
			afterRead(event) {
				// 这里可以添加文件上传前的处理逻辑
				// 例如：检查文件大小、类型等
				// 然后执行上传操作
				this.uploadFile(event.file);
			},
			// 文件超出大小限制时触发
			onOversize(event) {
				this.$u.toast(`文件超出限制的大小`);
			},
			// 删除文件的钩子
			onDelete(file, index) {
				// 这里可以添加删除文件的处理逻辑
				// 例如：从服务器删除文件
				this.fileList.splice(index, 1);
			},
			// 上传文件的方法
			uploadFile(file) {
				// 创建formData
				const formData = new FormData();
				formData.append('file', file);

				// 这里使用uni.uploadFile进行文件上传，你也可以使用其他方式
				uni.uploadFile({
					url: this.uploadUrl,
					filePath: file,
					name: 'file',
					formData: formData,
					success: (uploadFileRes) => {
						console.log('uploadFile success:', uploadFileRes);
						// 上传成功后的处理逻辑，例如将文件地址保存到fileList
					},
					fail: (error) => {
						console.error('uploadFile fail:', error);
						// 上传失败的处理逻辑
					},
				});
			},
		},
	};
</script>




<style>
</style>