vuedraggable禁止拖拽出所在区域

可以通过设置 `containment` 属性来限制 `vuedraggable` 元素的拖拽范围，使其不能拖拽出所在区域。

例如，如果你的 `vuedraggable` 元素位于 id 为 `container` 的元素内，可以这样设置：

<draggable v-model="list" :options="{containment: '#container'}">
  <!-- draggable item -->
</draggable>

这样设置后， `vuedraggable` 元素就不能拖拽出 `#container` 元素的范围了。

相关问题

vuedraggable禁止拖出所在区域

可以通过设置`group`属性的`pull`选项来禁止拖出所在区域。例如：

<draggable v-model="list" :group="{ pull: 'clone' }">
  <div v-for="(item, index) in list" :key="item.id">
    {{ item.name }}
  </div>
</draggable>

在上面的示例中，`pull`选项被设置为`clone`，这意味着元素只能被克隆而不是移动。因此，拖拽操作不会将元素从原始位置移除，也不会将其拖出`draggable`所在的区域。

vuedraggable2.4禁止拖拽出所在区域

可以通过设置 `group` 属性来限制拖拽出所在区域。具体方法如下：

1. 在引入 `vuedraggable` 的组件中设置 `group` 属性：

<template>
  <div>
    <draggable v-model="list" :group="{ name: 'list', pull: 'clone', put: false }">
      <!-- draggable items -->
    </draggable>
  </div>
</template>

2. 设置 `group` 属性的 `put` 属性为 `false`，表示不允许放置到其他分组中。

<draggable :group="{ name: 'list', pull: 'clone', put: false }"></draggable>

设置后，拖拽时只能在当前分组中移动，无法拖拽到其他分组中。