<template>
  <div>
    <Table class="table" :data="showInfo" :columns="columns"></Table>
  </div>
</template>

<script>
export default {
  props: {
    info: Array
  },
  data() {
    return {
      index: 0,
      timer: null,
      columns: [
        {
          key: "name",
          title: "资产名称"
        },
        {
          key: "dengjimianji",
          title: "登记面积"
        }
      ]
    }
  },
  methods: {},
  computed: {
    showInfo () {
      return this.info?.slice(this.index, this.index + 8) || [];
    }
  },
  watch: {
    info (newData) {
      this.$nextTick(() => {
        clearInterval(this.timer)
        if (this.info?.length > 8) {
          this.timer = setInterval(() => {
            this.index = (++this.index) % (this.info?.length || 0);
          },3000)
        }
      })
    }
  },
  beforeDestroy () {
    clearInterval(this.timer)
    console.log('des')
  }
}
</script>

<style scoped lang="scss">
.table {
  width: 320px;
  height: auto;
  max-height: 400px;
  overflow-y: hidden;
}

::v-deep .ivu-table {}
</style>
