I'm trying to place an onClick
handler on Link
child. The problem is it is not firing because of Link's
transition
method. Is there any preventDefault
or so? Here's the example in jquery world
how to stop redirection of parent href tag when clicked on child div?
We can prevent this default behaviour by making a small modification to the definition of the handleSubmit function. We call a preventDefault on the event when submitting the form, and this will cancel the default event behavior (browser refresh) while allowing us to execute any code we write inside handleSubmit.
Using componentDidUpdate method of React page lifecycle, you can handled or disabled go back functionality in browser. basically componentDidUpdate method will call automatocally when component got updated. so once your component is updated you can prevent to go back as below.
The onClick handler allows you to pass a function to a component, which will be executed when it's clicked. Call e. preventDefault() to prevent native default behavior, like submitting a form.
The preventDefault() method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur. For example, this can be useful when: Clicking on a "Submit" button, prevent it from submitting a form. Clicking on a link, prevent the link from following the URL.
From the onClick
docs:
A custom handler for the click event. Works just like a handler on an
a
tag - callinge.preventDefault()
will prevent the transition from firing, whilee.stopPropagation()
will prevent the event from bubbling.
So you should just be able to use e.preventDefault
https://github.com/rackt/react-router/blob/master/docs/API.md#onclicke
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