У меня есть массив объектов. Каждый объект содержит массив объектов.
eg:
wishlists: [
{
name: 'wishlist 1',
id: '123',
items: [
{
image: "foobar.jpg",
name: "warlock",
quantity: 1
},
{
image: "foobar1.jpg",
name: "warlock1",
quantity: 2
}
]
},
{
name: 'wishlist 2',
id: '1422',
items: [
{
image: "foobar.jpg",
name: "warlock",
quantity: 7
},
{
image: "foobar1.jpg",
name: "warlock1",
quantity: 2
}
]
}
]
Я использую vue draggable в цикле для отображения каждого списка.
<div v-for="(list, index) in wishlists">
<draggable v-model="list.items" :key="list._id" :options="{group:'wishes'}" class="dropZone" @change="checkMove">
</div>
Мой метод checkMove просто регистрирует событие изменения.
{added: {…}}
added:
element:
image: "foobar.jpg"
name: "Warlock"
quantity: 1
...
newIndex: 0
...
{removed: {…}}
removed: {element: {…}, oldIndex: 0}
...
{moved: {…}}
moved: {element: {…}, oldIndex: 1, newIndex: 0}
Мне нужно запускать POST при каждом действии. Я не хочу отправлять весь массив корневых списков желаний обратно на сервер при каждом событии, так как это было бы безумием! Мне нужно только POST, что изменилось.
Я вижу, что с помощью события @change я могу получить объект, который был перемещен, вместе с его позицией oldIndex (в старом списке) и его позицией newIndex (в новом списке). Однако мне ничего не говорят о списках. Мне нужно знать, из какого списка оно пришло и в какой список попало.
Есть ли способ получить эту информацию? Если я могу получить идентификатор списка желаний вместе с newIndex и oldIndex и т. д., то я могу отправить эту информацию обратно на сервер и обновить базу данных...
Я играл с каждым событием, и не похоже, чтобы кто-то давал какую-либо информацию о списке.