p7-uniCloud实战通讯录-删除联系人

62 阅读1分钟

删除需要考虑做的事情

  1. 弹出删除确认框
  2. 弹出loading
  3. 调用clientDB的js api删除云端数据
  4. 接收云端删除结果,如果成功则关闭loading
  5. 进一步删除列表的data中的对应item,自动刷新页面
  • schema配置里面加上删除权限

  • 然后添加udb删除代码

  <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"  @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: {
			rmItem(id) {
				console.log('id', id)
				this.$refs.udb.remove(id)
			}
		}
	}
</script>