vue-draggable-resizable parent

Vue draggable resizable是一个用于Vue.js的应用程序中的拖放和缩放功能的第三方库。它允许你在Vue组件上添加可拖动和可调整大小的功能，非常适合那些需要用户能够更改元素布局或尺寸的场景，比如网格布局编辑器、任务列表等。

在parent组件中使用`vue-draggable-resizable`，你需要先安装该库（如通过npm install vue-draggable-resizable），然后在模板中引用并配置它。通常的做法是引入组件，并指定可以拖动和缩放的对象，以及一些选项参数，比如：

<template>
  <draggable-resizable :items="items" :options="{group: 'items'}">
    <div v-for="(item, index) in items" :key="index" class="resizable-item">
      <!-- item内容 -->
    </div>
  </draggable-resizable>
</template>

<script>
import draggableResizable from 'vue-draggable-resizable'

export default {
  components: {
    draggableResizable,
  },
  data() {
    return {
      items: [
        { id: 1, title: 'Item 1', width: 200, height: 100 },
        // 更多项...
      ]
    }
  },
  // 其他methods和props
}
</script>

在这个例子中，`items`数组中的每个对象都代表一个可拖动/缩放的元素，`:options.group = 'items'`确保了它们在同一组内协同工作。