swipecell样式_反馈组件 SwipeCell 滑动单元格 - 闪电教程JSRUN

SwipeCell 滑动单元格

引入

import Vue from 'vue';

import { SwipeCell } from 'vant';

Vue.use(SwipeCell);

代码演示

基础用法

SwipeCell组件提供了left和right两个插槽，用于定义两侧滑动区域的内容

自定义内容

SwipeCell内容可以嵌套任意内容，比如嵌套一个商品卡片

num="2"

price="2.00"

desc="描述信息"

title="商品标题"

class="goods-card"

thumb="https://img.yzcdn.cn/vant/cat.jpeg"

/>

slot="right"

square

text="删除"

type="danger"

class="delete-button"

/>

.goods-card {

margin: 0;

background-color: @white;

}

.delete-button {

height: 100%;

}

异步关闭

通过传入before-close回调函数，可以自定义