Get $event on drag-enter/drag-leave

I am having an issue grabbing the event from these handlers. They fire okay but I am not sure how to get the event.

@drag-enter="onDragEnter($event)"

function onDragEnter(e) {
   console.log(e) //returns undefined
}

I’ve also tried adding vanilla events and they don’t seem to work. Even a click handler does not work. Is there a way I can get the event from those two drag events?

[zerosym]

@chrisdel101 drag-enter & drag-leave events don’t pass any parameters to handlers.

As for click handlers and other browser implemented events you can append .native to the event name:

@click.native="onClickHandler($event)"

[zerosym]

@krsyoung For your case that’s what I would do too.

My first syntax only works if you have split the container into its own component.

For example, instead of:

<template>
  <container v-for="i in items" ...>
</template>

You would need to do

<template>
  <my-component v-for="item in items" :item=item :key="item.id">
</template>

Where my-component is:

<template>
  <container @drag-enter="onDragEnter">
</template>

<script>
{
  props: ['item',],
  methods: {
    onDragEnter() {
      console.log(this.item.id)
    },
  },
}
</script>