Menu
There is a duplicate for each event on react audio and video tags, for example it has onCanPlayThrough property and onCanPlayThroughCapture as well. Behaviour for both of them in the browser is completely the same.
Do we need to use ...Capture events instead of standard events? What is the main idea for them? Where can I find information about them.
336
React onClickCapture is an event handler that gets triggered whenever we click on an element. like onclick, but the difference is that onClickCapture acts in the capture phase whereas onClick acts in the bubbling phase i.e. phases of an event.
Event capturing is one of two ways to do event propagation in the HTML DOM. In event capturing, an event propagates from the outermost element to the target element. It is the opposite of event bubbling, where events propagate outwards from the target to the outer elements.
With bubbling, the event is first captured and handled by the innermost element and then propagated to outer elements. With capturing, the event is first captured by the outermost element and propagated to the inner elements.
This is covered in the React documentation here, though it's easy to miss:
The event handlers below are triggered by an event in the bubbling phase. To register an event handler for the capture phase, append
Captureto the event name; for example, instead of usingonClick, you would useonClickCaptureto handle the click event in the capture phase.
DOM events have multiple phases (see diagram below), which are (in order):
Normally we use target or bubbling (addEventListener's false third param [the default]), but there are rare occasions where you want to hook into the capture phase instead (third param = true). The ...Capture handlers let you do that.
115
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
