<template>
  <div class="swipe">
    <swipe class="swipe-item" v-for="(v, index) in list" :key="v" @btnClick="onDel(index)">
      <div @click="onClick" style="width:200px;border:1px solid red;">123456789</div>
    </swipe>
  </div>
</template>
<script lang="ts">
import Vue from 'vue'
import { PushBar, Swipe } from '../../tunas'

export default Vue.extend({
  components: {
    PushBar, Swipe
  },

  data () {
    return {
      list: [0, 1, 2, 3, 4]
    }
  },

  methods: {
    onDel (index) {
      console.log(index)
      this.list.splice(index, 1)
    },
    onClick () {
      console.log('im btm')
    }
  }
})
</script>

<style lang="stylus" scoped>
.swipe
  // margin 0 -15px
  &-item
    // position relative
    margin-top 20px
    // &::before
    //   box-sizing border-box
    //   content ' '
    //   position absolute
    //   transform-origin 0 0
    //   left 0
    //   bottom 0
    //   width 100%
    //   height 1px
    //   border-bottom 1px solid grey
    //   transform scaleY(0.5)
</style>

