<vuedraggable class="images" v-model="ids" @end="updateValue" > <div class="item" v-for="(item, index) in list"> <a-icon class="action-item delete-icon" type="delete" @click.stop="deleteItem(item)"></a-icon> <img :src="item.thumb" class="thumb" /> <div class="type-c">{{item.type_text}}</div> <div class="status-c" v-if="item.status == 0">已下架</div> <div class="title" :title="item.title">{{item.title}}</div> </div> </vuedraggable> 第一次移动总会带第一个
时间: 2023-07-19 14:29:24 浏览: 98
<div class="top">我的网页设计作业</div>
根据你提供的代码,我看到你正在使用 `vuedraggable` 组件来进行拖拽排序。如果第一次移动总会带第一个,可能是由于你的列表数据 `list` 中的第一个元素,也就是 `v-for` 中的 `item`,在数据源中的位置是第一位,而 `vuedraggable` 默认会将第一个元素作为默认拖拽的元素。这会导致第一次移动时会带上第一个元素。
为了解决这个问题,你可以尝试将数据源 `list` 中的第一个元素放到其他位置,或者在拖拽之前先将第一个元素与其他元素进行交换位置,这样第一次移动时就不会带上第一个元素了。例如,你可以在组件中添加一个 `mounted` 钩子函数,将数据源中的第一个元素与第二个元素位置进行交换,代码如下:
```
mounted() {
// 将第一个元素与第二个元素位置进行交换
if (this.list.length > 1) {
let temp = this.list[0];
this.list[0] = this.list[1];
this.list[1] = temp;
}
},
```
这样,第一次移动时就不会带上第一个元素了。
阅读全文