Swiper - prevent click on parent element when drag

eu97 0
Viewed 30

Is there a quick solution to prevent click at parent element when I release drag on slider?

Problem: click on the product card is counted when the user drags a photo in the slider. What way to make sure that a click on the product card is not counted when the user drags and releases a photo in the slider? enter image description here

<ProductCard onClick={onClick}>
  <div className={image_wrapper}>
    <ProductCardCarousel images={photos} />
  </div>
  <div>Product Name</div>
  ....
</div>

Perhaps there is a setting in the swiper, which I can'n find, or do I have to write it?

swiper.js reactjs javascript
1 Answers

You can use e.stopPropagation() method. This method will prevent the parent event handlers from being executed.

Example -

function onClick(e){
e.stopPropagation();
console.log("Click handler")
//code here
}

Anusha Singla0
Related