v-swipeout

Swipe out ui component for vue
1,518 6
Install
npm install v-swipeout
Latest Version:1.0.7
Vue:2
License:MIT
Last Updated:May 19, 2026
Links: GitHub  ·  npm
Maintainer: ttian226

v-swipeout

Build Status

Install

npm install --save v-swipeout

Usage

import VSwipeout from 'v-swipeout';

export default {
  methods: {
    readBtn () {
      console.log('read')
    },
    replayBtn () {
      console.log('replay')
    },
    moreBtn () {
      console.log('more')
    },
    deleteBtn () {
      console.log('delete')
    },
    openCb () {
      console.log('open')
    },
    closeCb () {
      console.log('close')
    }
  },
  components: {
    VSwipeout
  }
}
<v-swipeout
  :autoClose="false"
  :style="{ backgroundColor: 'white' }"
  :left="[
    {
      text: 'read',
      onPress: readBtn,
      style: { backgroundColor: 'blue', color: 'white' }
    },
    {
      text: 'reply',
      onPress: replayBtn,
      style: { backgroundColor: 'green', color: 'white' }
    }
  ]"
  :right="[
    {
      text: 'more',
      onPress: moreBtn,
      style: { backgroundColor: 'orange', color: 'white' }
    },
    {
      text: 'delete',
      onPress: deleteBtn,
      style: { backgroundColor: 'red', color: 'white' }
    }
  ]"
  :onOpen="openCb"
  :onClose="closeCb"
>
  <div 
    :style="{
      height: 44,
      backgroundColor: 'white',
      lineHeight: '44px',
      borderTop: '1px solid #dedede',
      borderBottom: '1px solid #dedede',
    }"
  >
    swipe out simple demo
  </div>
</v-swipeout>

API

Props

name description type default
style swipeout style Object
left swipeout buttons on left Array null
right swipeout buttons on right Array null
autoClose auto close on button press Boolean false
onOpen open callback (): void function() {}
onClose close callback (): void function() {}

Button props

name description type default
text button text String
style button style Object
onPress button press function (): void function() {}

Related Packages

vue-json-tree-view

a JSON Tree View Component in Vue.js

380,792 473
@v-c/picker

picker ui component for vue

57,185 32
vue-frame-crm

vue components for crm system

15,005
kokk

A beautiful way to create a documentation from markdown, and insert a vue compon...

10,142 49
vue-desktop

A UI library for building admin panel website.

4,851 540

Version History

Version Released Vue License
1.0.7 ^2.5.2 MIT
1.0.6 ^2.5.2 MIT
1.0.5 ^2.5.2 MIT
1.0.4 ^2.5.2 MIT
1.0.3 ^2.5.2 MIT