VueDraggable 嵌套使用

VueDraggable是一个基于Vue.js的轻量级拖拽组件库，它允许你在Vue应用中添加拖放功能。如果你想在Vue项目中嵌套使用VueDraggable，可以按照以下步骤操作：

1. **安装依赖**：
首先，在你的Vue项目里通过npm或yarn安装`vuedraggable`包：

   npm install vuedraggable
   # 或者
   yarn add vuedraggable

2. **引入并注册**：
在你的Vue组件中导入VueDraggable，并在`components`选项中注册它：

   import draggable from 'vuedraggable';

   export default {
     components: {
       draggable,
     },
     //...
   };

3. **使用draggable属性**：
当你需要创建一个可拖动元素时，可以在一个div或者其他标签上使用`draggable`属性，并配置需要的选项。例如，如果想让某个数组里的元素可以互相拖动：

   <ul id="list" v-model="items">
     <li v-for="(item, index) in items" :key="index" draggable="{group: 'multi'}">
       {{ item }}
     </li>
   </ul>

这里设置了`group`选项，使得所有li元素都在同一组内，可以互相拖动。

4. **处理拖拽事件**：
使用`@start`、`@end`等事件处理器来监听开始拖动、结束拖动等动作，并在你的JavaScript中编写相应的业务逻辑。

5. **嵌套使用**：
如果有更复杂的结构，比如列表中有嵌套的列表，只需将draggable应用到对应的容器即可。注意递归地设置好`group`和其他必要选项。

**相关问题--:**
1. VueDraggable支持哪些常见的拖拽选项？
2. 如何阻止VueDraggable的默认行为？
3. 我怎样才能在VueDraggable的基础上自定义样式和交互效果？