vuedraggable使用文档

<draggable 
    class="image-list" 
    :list="fileList" 
    :animation="100" 
    item-key="id" 
    :forceFallback="true"
    ghost-class="ghost" 
    chosen-class="chosenClass"
    @change="onMoveCallback"
    >
    <template 
        #item="{ element }" 
        :key="element.uid"
        >
        <div class="image">
            <el-image :src="element.url" :preview-src-list="srcList" :initial-index="previewIndex" fit="fill"
                @show="show(element.index)" style="width: 100%; height: 100%" />
            <span class="del-image" v-if="!disabled" @click="handleRemove(element)">
                <el-icon>
                    <Close />
                </el-icon>
            </span>
        </div>
    </template>
</draggable>

/*
draggable 对CSS样式没有什么要求万物皆可拖拽
:list="fileList"         //需要绑定的数组
ghost-class="ghost"        //被替换元素的样式
chosen-class="chosenClass" //选中元素的样式
animation="300"            //动画效果
@start="onStart"           //拖拽开始的事件
@end="onEnd"               //拖拽结束的事件
@change="onMoveCallback" //拖拽元素位置改变事件。会改变绑定数组的顺序，能读取当前被拖动的元素数据
*/

.ghost {
  border: solid 1px rgb(19, 41, 239);
}
.chosenClass {
  background-color: #f1f1f1;
}

属性说明

事件