DaoDao/DaoDaoFrontend/pages/tabbar-3-detial/tabbar-3-release/tabbar-3-release.vue

<template>
	<view class="container">
		<uni-section title="选择图片" titleFontSize="24px" type="line">
			<view class="example-body">
				<uni-file-picker ref="files" :auto-upload="false" v-model="imageValue" fileMediatype="image" mode="grid"
					@select="select" @progress="progress" @success="success" @fail="fail" limit="9" title="最多选择9张图片">
				</uni-file-picker>
			</view>

		</uni-section>
		<button @click="upload">上传文件</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imageValue: []
			}
		},
		onLoad() {

		},
		methods: {
			// 获取上传状态
			select(e) {
				console.log('选择文件：', e)
			},
			// 获取上传进度
			progress(e) {
				console.log('上传进度：', e)
			},

			// 上传成功
			success(e) {
				console.log('上传成功')
			},

			// 上传失败
			fail(e) {
				console.log('上传失败：', e)
			},
			upload() {
				this.$refs.files.upload()
			}
		}
	}
</script>

<style>
	.container {
		padding: 20upx;
	}

	.example-body {
		padding: 15px;
		padding-top: 0;
	}

	.custom-image-box {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.text {
		font-size: 24px;
		color: #333;
	}
</style>