< script >
export default {
data () {
return {
colors: [{
text: "Aquamarine"
}, {
text: "Hotpink"
}, {
text: "Gold"
}, {
text: "Crimson"
}, {
text: "Blueviolet"
}, {
text: "Lightblue"
}, {
text: "Cornflowerblue"
}, {
text: "Skyblue"
}, {
text: "Burlywood"
}]
}}
}
< / script >
< div class= "color-list" >
<div
class="color-item"
v-for="color in colors" v-dragging="{ item: color, list: colors, group: "color" }"
:key="color.text"
>{{color.text}}</div> < / div >
export default {
mounted () {
this.$dragging.$on("dragged", ({ value }) => {
console.log(value.item)
console.log(value.list)
console.log(value.otherData)
})
this.$dragging.$on("dragend", () => {
})}
}
but what if the data structure is one of the following?
data:[
{
name: "",
children: [
{
name: "",
path: "/nav/dashboard/dash1"
}, {
name: "",
path: "/nav/dashboard/dash2"
}
]
},