SwipeCell 滑动单元格

引入

通过以下方式来全局注册组件，更多注册方式请参考。

基础用法

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

<van-swipe-cell>
  <template #left>
    <van-button square type="primary" text="选择" />
  </template>
  <van-cell :border="false" title="单元格" value="内容" />
  <template #right>
    <van-button square type="danger" text="删除" />
    <van-button square type="primary" text="收藏" />
  </template>
</van-swipe-cell>

自定义内容

通过传入 before-close 回调函数，可以自定义两侧滑动内容关闭时的行为。

  <template #left>
    <van-button square type="primary" text="选择" />
  </template>
  <van-cell :border="false" title="单元格" value="内容" />
  <template #right>
    <van-button square type="danger" text="删除" />
  </template>
</van-swipe-cell>

Props

Slots

Events

beforeClose 的第一个参数为对象，对象中包含以下属性：

方法

类型定义

组件导出以下类型定义：

import type {
  SwipeCellSide,
  SwipeCellProps,
  SwipeCellPosition,
} from 'vant';

是组件实例的类型，用法如下：

在桌面端无法操作组件？