DragStop and ResizeStop reference to component that was manipulated? about vue-drag-resize HOT 1 OPEN

<template>
  <VueDragResize v-for="(rect, index) in rects"
    :key="index"
    :w="rect.width"
    :h="rect.height"
    :x="rect.left"
    :y="rect.top"
    @dragstop="onDragStop($event, index)"
  >
    <p>Hello World!</p>
  </VueDragResize>
</template>

<script>
import VueDragResize from '../components/vue-drag-resize.vue';

export default {
  components: {
    VueDragResize
  },
  data() {
    return {
      // your dynamic components rect data...
      rects: [
        {
          w: 200,
          h: 100,
          x: 10,
          y: 10,
        },
        {
          w: 200,
          h: 100,
          x: 300,
          y: 150,
        },
        {
          w: 200,
          h: 100,
          x: 50,
          y: 280,
        },
      ]
    };
  },
  methods: {
    onDragStop(rect, index) {
      console.log(rect);   // rect event data
      console.log(index);  // custom data -> index of element
    }
  }
};
</script>