uniapp 将图片文本上传至数据库存储，图片的存储与数据库保存，文件上传

<view class="home">

		<uni-file-picker v-model="imageValue" fileMediatype="image" mode="grid" :autoUpload="false" returnType="object"
			@select="select" @progress="progress" @success="success" @fail="fail" ref="files" />
		<!-- 
		v-model双向绑定
		fileMediatype文件的上传类型image图片
		mode="grid"图片上传界面网格类型
		autoUpload取消自动上传
		returnType:"object"单选
		@select="select"选择事件
		@progress="progress" 进度事件
		@success="success" 成功事件
		@fail="fail" 失败事件
		 -->

		<input type="text" name="name" v-model="name" placeholder="请输入姓名"/>
		<input type="text" name="gender" v-model="gender" placeholder="请输入性别"/>
		<button @click="onsubmit">提交</button>


	</view>

一个文件上传组件，两个输入框，一个提交按钮

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

		},
		methods: {
			//提交按钮点击事件
			onsubmit(e) {
				this.$refs.files.upload()
			},

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

			// 上传成功
			success(e) {
				console.log('上传成功', e)
				this.avatar = e.tempFilePaths[0]

				uniCloud.callFunction({
					name: "mycloudfuns",
					data: {
						name: this.name,
						gender: this.gender,
						avatar: this.avatar,
					}
				}).then(res => {
					console.log(res);
				})
			},

			// 上传失败
			fail(e) {
				console.log('上传失败：', e)
			}

		}
	}
</script>

按钮点击之后先完成图片的上传，然后把下载链接存储到avatar数组中，然后连接云函数

const db = uniCloud.database()
exports.main = async (event, context) => {
	let {name,gender,avatar}=event
	return await db.collection("user").add({
		name,
		gender,
		avatar
	})
};

通过云函数add将数据存储到数据库中