Vue-slider-component: Stop Drag Event propagation when in a draggable component

[advancedlogic]

I am trying to embed your component into a (vue-draggable-resizable) component but when I drag the slide, also the component below starts moving. I am trying to add a stopPropagation on the event _@drag-start_ but without success.
Any suggestion?

[NightCatSama]

You can try the event-type attribute to make the component unusable.

[advancedlogic]

It does not work. The problem is not to disable your component but disable the drag of the component below. How can I get the event on @drag-start and @drag-end in order to fire a stopPropagation()?

[NightCatSama]

I added the stopPropagation property to prevent the event from bubbling.

In version 2.4.4 you can use :stop-propagation="true" to prevent bubbling.

[advancedlogic]

Thanks, it works :)

[mbranicky]

In current 3.2.5 version this attribute is still available? I am using it but no effect. Was it removed in the past versions?

[NightCatSama]

@mbranicky Try this?

  <vue-slider 
    @mousedown.native.stop="_ => null" 
    @mousemove.native.stop="_ => null" 
  />

[mbranicky]

@NightCatSama unfortunately it doesn't work. I tried several combinations, no luck. However I workaround the solution in a way that in @drag-start event I temporarily disable the draggable attribute of the parent element, which is also a draggable component. And in @drag-end I again enable the same draggable attribute. Works nice.