web前端-uni-app-uni-app的云函数的数据库操作

1.uni-app的云函数的数据库操作

1.这个是写的云函数里面的

'use strict';
const db = uniCloud.database()
exports.main = async (event, context) => {
  //event为客户端上传的参数
	// context包含了调用信息和运行状态,每次调用的上下文


	// 聚合
	// ---------------增加
	/* const collection = db.collection('user')
	// 增加
	// let res = await  collection.add({
	// 	name:"uni-app"
	// }) 
	
	// 批量增加
 	let res = await collection.add([
		{
			name: 'vue'
		},
		{
			name: 'html',
			type: '前端基础'
		}
	]) 
	console.log(JSON.stringify(res)) // 转为字符串 */
	
	//---------------------删除
/* 	const collection = db.collection('user')
	const res = await collection.doc('5ebe58418cf51d004c4fd0bb').remove()
	console.log(JSON.stringify(res)) */
	
	//----------------更新第一种
/* 	const collection = db.collection('user')
		const res = await collection.doc('5ebe58418cf51d004c4fd0ba').update({
			name: 'react'
		})
		console.log(JSON.stringify(res)) */
	
	//----------------更新第二种
/* 	const collection = db.collection('user')
		const res = await collection.doc('5ebe58418cf51d004c4fd0ba').set({
			name: 'bootstrap4'
		})
		console.log(JSON.stringify(res)) */
	/* 
		update与set的区别
		update:是不能更新没有的,只能更新存在的记录
		set:如果没有这个数据,会新增的,如果存在就更新,不存在那就新增
	 */
	
	//----------------查询--单方面查询
/* 	const collection = db.collection('user')
	const res = await collection.doc('5ebd27fa3e8e0b004d9ca9c8').get()
	console.log(JSON.stringify(res)) */
	
	
	//----------------条件查询
	const collection = db.collection('user')
	const res = await collection.where({
		name: event.name
	}).get()
	console.log(JSON.stringify(res.data))
	
  return {
		code:200,
		msg:"查询成功",
		data:res.data
	}
};


2.这个是写在页面里面的pages里面的

			open(){
				uniCloud.callFunction({
					name:"get_list",
					data:{
						name: "wangyang",
						age:15
					},
					success(res) {
						console.log(res)
					},
					fail() {
						
					}
				})
			} 

这里要注意:写完云函数,一定要上传部署!!!
  1. uni-app的图片上传
<image class="logo" :src="src"></image>
<button @click="open">执行云函数</button>

		data() {
			return {
				src:''
			}
		},

		methods: {
			open(){
				let self  = this
				uni.chooseImage({
					count:1,
					success(res) {
						const tempFilePaths = res.tempFilePaths[0]
						console.log(tempFilePaths)
						uniCloud.uploadFile({
							filePath:tempFilePaths,
							success(res) {
								console.log(res)
								self.src = res.fileID
							},
							fail(err) {
								console.log(err)
							}
						})
					},
					fail(err) {
						console.log(err)
					}
				})
			}
		}
	

3.删除云函数上传的图片

	// 删除
			open(){
				let self = this
				uniCloud.deleteFile({
					fileList:['https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uniff40287/6dcd0230-9719-11ea-b43d-2358b31b6ce6.jpeg'],
					success(res) {
						console.log(res)
					},fail(err) {
						console.log(err)
					}
				})
			}

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
lottie-web 是一个开源的 JavaScript 库,用于在 Web 上播放动画。而 Uni-app 是一个基于 Vue.js 的跨平台开发框架,允许开发者使用 Vue 组件的方式开发多端应用。 要在 Uni-app 中使用 lottie-web,需要先在项目中引入 lottie-web 的 JavaScript 库。可以通过 npm 安装 lottie-web: 1. 打开项目目录,在终端中运行命令 `npm install lottie-web`,等待安装完成。 2. 安装完成后,在需要使用 lottie-web 的页面或组件中引入 lottie: ```javascript import lottie from 'lottie-web'; ``` 接下来,可以在 Vue 组件中使用 lottie-web 进行动画的播放: 1. 在组件的 `data` 方法中定义一个变量,用于存储 lottie-web 的实例: ```javascript data() { return { lottieInstance: null }; } ``` 2. 在组件的 `mounted` 生命周期钩子函数中,初始化 lottie-web 实例,加载动画文件,并播放: ```javascript mounted() { this.lottieInstance = lottie.loadAnimation({ container: this.$refs.lottieContainer, // 动画容器元素的引用 path: 'path/to/animation.json', // 动画文件的路径 renderer: 'svg', // 渲染器类型,可根据需要选择 loop: true, // 是否循环播放 autoplay: true // 是否自动播放 }); } ``` 3. 在组件的模板中指定一个容器元素,并通过 `ref` 属性引用它: ```html <template> <div ref="lottieContainer"></div> </template> ``` 这样,lottie-web 的动画就会在容器元素中显示出来,并根据配置的选项进行播放。 需要注意的是,保证 lottie-web 的 JavaScript 库已经正确安装,路径和文件名也要与实际情况一致,确保操作正确无误。如有需要,还可以根据 lottie-web 提供的 API 进行更多的动画控制和交互。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值