I am using Vuedraggable Component which has a Element.
It gets draggable when click + move the mouse across the screen. After releasing the click from the mouse, I want to get a X,Y coordination where we release the mouse move position.
Here is my sample code,
<draggable class="dragArea list-group" :list="list1" @change="log">
<div
v-for="element in list1"
:key="element.name"
class="list-group-item"
>
<button class="button button--line" @change="down" @click="up">
{{ element.name }}
</button>
</div>
</draggable>
import draggable from 'vuedraggable';
export default {
name: 'test',
data: () => {
return {
list1: [{ name: 'Signature Draggable', id: 1 }],
}
},
methods: {
down(e) {
console.log('>>>>>>>>>>>>>>>>1111121');
e.target.offsetLeft - e.clientX, e.target.offsetTop - e.clientY;
},
up(event) {
console.log('###############1111121');
}
}
Kindly help me to get the X,Y Coordination.