SwipeItem.vue.bak 1.06 KB
Newer Older
Nature's avatar
Nature committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50
<template>
  <section :class="[c(),cusClass]" :style="style">
    <slot/>
  </section>
</template>

<script>
  import {base} from '../../common/mixins'

  export default {
    name: 'SwipeItem',
    mixins: [base],

    data() {
      return {
        offset: 0,
      }
    },
    props: {
      cusClass: {
        type: String,
        default: ''
      }
    },
    computed: {
      style() {
        const {vertical, width, height} = this.$parent

        return {
          width: width + 'px',
          height: vertical ? height + 'px' : '100%',
          transform: `translate${vertical ? 'Y' : 'X'}(${this.offset}px)`,
        }
      },
    },
    mounted() {
      console.log('mounted');
      this.$parent && this.$parent.swipes.push(this);
      const rect =  this.$el.getBoundingClientRect()
      debugger;
      this.$parent && this.$parent.itemsHeight.push(this.$el.offsetHeight);
    },
    activated(){
      console.log('updated');
    },
    destroyed() {
      this.$parent && this.$parent.swipes.splice(this.$parent.swipes.indexOf(this), 1)
    },
  }
</script>