I am having an svg element on which I need to capture the mousedown
event.
Here is the code.
//code snippet...
<g onMouseDown={this.clickHandler}>
<circle ...></circle>
<text> </text>
</g>
Code for click handler is as simple as this.
clickHandler() {
alert("mouse down")
}
onMouseUp
and OnClick
are working fine, but not the onMouseDown
The same onMouseDown
event in working fine outside the SVG (I tried on Button)
Any Idea about the error.
React Version: 16.5.2
OnMouseDown
will get a block if you are also having the drag functionality implemented.
To capture the OnMouseDown
you need to remove event.stopPropogation()
from your dragStartEvent
Another Interesting thing is if you don't want to remove event.stopPropogation()
you can still perform the all the operation which you intend to perform on OnMouseDown
in dragStartEvent
event.
Hope this helps...
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With