uni-app操作数据库的三种方法总结

更新时间：2023年05月23日 09:37:02 作者：lqj_本人

数据库操作的,可以采用多方案,下面这篇文章主要给大家介绍了关于uni-app操作数据库的三种方法,文中通过实例代码和图文介绍的非常详细,需要的朋友可以参考下

前端与后端（云端）分离实现数据库的操作

1.使用云函数来操作数据库

第一步：

创建一个云函数并部署

第二部：

在云函数中写入数据库的操作代码：

const db = uniCloud.database();
exports.main = async (event, context) => {
	//event为客户端上传的参数
	//返回数据给客户端
	return await db.collection("News_system").add({
		xingming:"张三"
	})
};

第三步：

前端代码：

<template>
	<view>
		<button @click="add">添加</button>
	</view>
</template>
<script>
	// const db = uniCloud.database();
	export default {
		data() {
			return {
			}
		},
		onLoad() {
		},
		methods: {
			add(){
				// return db.collection("News_system").add({
				// 	xingming:"1111"
				// }).then(res=>{
				// 	console.log(res)
				// })
				uniCloud.callFunction({
					name:"hanshu1"
				}).then(res=>{
					console.log(res)
				})
			}
		}
	}
</script>
<style>
</style>

显示数据库数据表信息添加情况：

2.使用云对象来操作数据库

第一步：

先创建一个云对象并写入相应的数据库操作的代码：

const db = uniCloud.database();
module.exports = {
	_before: function () { // 通用预处理器
	},
	add:()=>{
		 db.collection("News_system").add({
			nianling:16
		})
	}
}

第二步：

将其上传部署！

第三步前端代码：

<template>
	<view>
		<button @click="add">添加</button>
	</view>
</template>
<script>
	const duixiang1 = uniCloud.importObject("duixiang1")
	// const db = uniCloud.database();
	export default {
		data() {
			return {
			}
		},
		onLoad() {
		},
		methods: {
			add(){
				duixiang1.add().then(res=>{
					console.log(res)
				})
				// return db.collection("News_system").add({
				// 	xingming:"1111"
				// }).then(res=>{
				// 	console.log(res)
				// })
				// uniCloud.callFunction({
				// 	name:"hanshu1"
				// }).then(res=>{
				// 	console.log(res)
				// })
			}
		}
	}
</script>
<style>
</style>

注意：我这里必选先调用一下我们写的云对象，然后调用后直接对我们新赋值的参数进行操作即可！

const duixiang1 = uniCloud.importObject("duixiang1")

duixiang1.add().then(res=>{
					console.log(res)

回到数据库：我们可以发现我们点击按钮时，我们想添加的数据已经在我们的数据库中了！

前端与后端（云端）结合实现客户端操作数据库

3.使用DB Schema结构规范实现客户端对数据库的操作

第一步：

我们线在数据库中创建一个数据表。

第二步：

在 uniCloud中的database中右键，后选择下载所有DB Schema及扩展校验函数。

等在下载完毕后我们会发现

我们的数据表：News_system已经在database中。

第三步：

然后我们打开它后，我们将原来的表文件改为：

注意：

将：

"read": true,
"create": true,

是将我们数据表中的权限的”读取“和”添加“打开！

properties中我们需要添加我们结合前端的需要在数据表中添加的数据（请结合第四步理解）：

        "xingming": {
            "bsonType": "string",
            "title": "姓名"
        }

第四步：

<template>
	<view>
		<button @click="add">添加</button>
	</view>
</template>
<script>
	const db = uniCloud.database();
	export default {
		data() {
			return {
			}
		},
		onLoad() {
		},
		methods: {
			add(){
				return db.collection("News_system").add({
					xingming:"1111"
				}).then(res=>{
					console.log(res)
				})
			}
		}
	}
</script>
<style>
</style>

我们直接在前端对数据库进行一系列的操作：

const db = uniCloud.database();

return db.collection("News_system").add({
					xingming:"1111"
				}).then(res=>{
					console.log(res)
				})

我们这里想要添加的

xingming:"1111"

要必须在第三步中的数据表中进行xingming这个参数名的配置。

如第三步中的：

        "xingming": {
            "bsonType": "string",
            "title": "姓名"
        }

回到前端页面：

我们发现，当我们点击添加时，后台已经给我们打印出来了东西，说明我们的数据表的权限已经处于打开状态，并且此时我们的想要添加的数据已经成功的添加到数据库中。

回到后端(云端)数据库：

我们可以发现，我们通过修改数据表权限的方式能实现通过纯前端的操作就可以实现对数据库进行操作！

总结

到此这篇关于uni-app操作数据库的三种方法的文章就介绍到这了,更多相关uni-app操作数据库内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

js改变鼠标的形状和样式的方法
常用的改变鼠标样式的方法：如果你想鼠标移动到某个元素上改变鼠标样式就在这个元素的样式里加上 cursor:(你想改的样式)
2014-03-03
[Bootstrap-插件使用]Jcrop+fileinput组合实现头像上传功能实例代码
这篇文章主要介绍了[Bootstrap-插件使用]Jcrop+fileinput组合实现头像上传功能实例代码,非常具有实用价值，需要的朋友可以参考下。
2016-12-12
原生JS实现平滑回到顶部组件
返回顶部组件是一种极其常见的网页功能，需求简单：页面滚动一定距离后，显示返回顶部的按钮，点击该按钮可以将滚动条滚回至页面开始的位置,接下来通过本文给大家介绍原生JS实现平滑回到顶部组件，需要的朋友参考下吧
2016-03-03
JavaScript设计模式经典之命令模式
命令模式（Command）的定义是：用来对方法调用进行参数化处理和传送，经过这样处理过的方法调用可以在任何需要的时候执行。接下来通过本文给大家介绍JavaScript设计模式经典之命令模式，需要的朋友参考下
2016-02-02
JS 去前后空格大全(IE9亲测)
本文为大家详细介绍下JS去前后空格及所有空格，代码在IE9环境下测试，感兴趣的朋友可以参考下哈，希望对大家有所帮助
2013-07-07
JavaScript访问CSS属性的几种方式介绍
要通过元素访问样式表，那么就应该先确定是哪个元素。直接访问样式表在该样式块里找相应的样式规则，最后在该样式规则里找相应的样式
2014-07-07
JavaScript+HTML5实现的日期比较功能示例
这篇文章主要介绍了JavaScript+HTML5实现的日期比较功能,涉及javascript结合HTML5针对日期的转换与运算相关操作技巧,需要的朋友可以参考下
2017-07-07
JS实现数组去重及数组内对象去重功能示例
这篇文章主要介绍了JS实现数组去重及数组内对象去重功能,结合实例形式分析了ES5与ES6两种版本针对数组去重的相关操作技巧,需要的朋友可以参考下
2019-02-02
微信小程序实现的一键复制功能示例
这篇文章主要介绍了微信小程序实现的一键复制功能,结合实例形式分析了微信小程序wx.setClipboardData接口实现操作粘贴板进行复制操作的相关使用技巧,需要的朋友可以参考下
2019-04-04
利用JavaScript编写一个花里胡哨的点击按钮
这篇文章主要介绍了如何利用HTML+CSS+JavaScript制作一个花里胡哨的点击按钮。文中的示例代码讲解详细，感兴趣的小伙伴可以了解一下
2022-03-03