p9-uniCloud实战通讯录-修改联系人

更新功能

• 先把增加的那页直接复制到更新
• 添加_id，需要拿到更新哪一条id

先在list中添加点击跳转

  <template>
		<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" collection="contacts">
			<view v-if="error">{{error.message}}</view>
			<view v-else>
				<uni-list>
					<uni-list-item v-for="item in data" :clickable="true" @click.native="updateFn(item)" @longpress.native="rmItem(item._id)" :key="item._id" :title="item.name" :note="item.phone"></uni-list-item >
				</uni-list>
			</view>
		</unicloud-db>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello'
			}
		},
	
		methods: {
			updateFn(item) {
				console.log('item', item)
				uni.navigateTo({
					url: './update/update?item=' + JSON.stringify(item),
					success: res => {},
					fail: () => {},
					complete: () => {}
				})
			},
			rmItem(id) {
				console.log('id', id)
				this.$refs.udb.remove(id)
			}
		}
	}
</script>

然后在update中进行修改

• 编辑页面的代码，找到id，然后更新

<template>
	<view>
		<uni-easyinput v-model="item.name" placeholder="name"></uni-easyinput>
		<uni-easyinput v-model="item.phone" placeholder="phone"></uni-easyinput>
		<button type="default" @click="submit">提交</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				item: {
					"_id":"",
					"name": "",
					"phone": ""
				}
			}
		},
		onLoad({item}) {
			this.item = JSON.parse(item)
		},
		methods: {
			submit() {
				const db = uniCloud.database();
				let item = {...this.item}
				delete item._id
				console.log('this.item', this.item)
				db.collection('contacts').doc(this.item._id).update(item).then(
					e=> {
						console.log(e)
					}
				)
			}
		}
	}
</script>

<style>

</style>