SwipeCell 滑动单元格实践

实现的功能
1.左滑删除

<van-swipe-cell :right-width="110">
	<li slot="default">
		<img src="@img/home/6.png" alt="">
		<div class="text">
		<h2 class="toe">蛋糕店策划</h2>
		<p class="toe">传统行业面临传承求新的阶段</p>
		</div>
	</li>
	<div class="delete-button" slot="right" @click="Close">删除</div>
</van-swipe-cell>

<script>
methods:{
	//删除
	Close(){
		this.$toast.success({
			message: '删除成功',
			duration: 2000,
			forbidClick:true,
		});
		setTimeout(() => {
			this.list.splice(index,1);//从列表删除该数据
		}, 2000)
	},
}
</script>

在这里插入图片描述
在这里插入图片描述

发布了97 篇原创文章 · 获赞 152 · 访问量 6512

猜你喜欢

转载自blog.csdn.net/qq_40745143/article/details/104961710