uni-app云开发知识总结

1.下载最新版的HubilderX，并创建一个uniCloud的项目

 2.创建云开发服务器：

2.1并右键打开uniCloud Web控制台

2.2找到云开发cloud项目目录下的cloudfunctions,右键点击新建云函数/云对象并创建

2.3并创建base文件

 

3.创建服务空间：

3.2创建服务空间并创建concat找到表结构

1.把表结构

2.关联云服务空间：

2.1右键点击关联云服务空间：

 2.2创建成功后如下：

 

4.修改base目录下的index.html：

5.找到pages目录下的index目录下的index.html

<template>
	<view class="content">
		<button @click="call">呼叫云开发</button>

		<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" collection="concat">
			<view v-if="error">{{error.message}}</view>
			<view v-else>
				<uni-list>
					<uni-list-item link :to="'/pages/update/update?item='+JSON.stringify(item)"
						@longpress.native="$refs.udb.remove(item._id)" v-for="item in data" :key="item._id"
						:title="item.username" :note="item.tel">

					</uni-list-item>
				</uni-list>
			</view>
		</unicloud-db>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				title:"Hello"
			}
		},
		onLoad(){
			
		},
		onShow() {
			if(this.$refs&&this.$refs.udb){
				this.$refs.udb.refresh();
			}
		},
		methods:{
			call(){
				uniCloud.callFunction({
					name:"base",
					data:{name:"lhp",age:18}
				})
				.then(res=>{
					uni.showModal({
						content:JSON.stringify(res.result)
					})
				})
			}
		}
	}
</script>

<style>

</style>

运行的结果：

 

 6.找到云数据库新建数据表：

6.1：打开hubilderx找到concat目录下的database

1.1右键点击下载所有的DB Schema及扩展校验函数：

1.2找到database目录下的opendb-city-china.schema.json

右键点击：schma2code

 1.3创建完之后会出现pages目录下opendb-contacts

1.4找到list.vue {{item._id}}修改为{{item.username}}

 运行结果：

找到hubilderx的工具，插件市场，搜索uni-ui组件

并下载下来