mirror of
https://github.com/reactjs/react.dev.git
synced 2026-02-24 04:33:10 +00:00
Update 2020-08-10-react-v17-rc.md (#3190)
Use modern syntax for a capture-phase event listener example: flags object rather than raw boolean
This commit is contained in:
@@ -94,13 +94,13 @@ document.addEventListener('click', function() {
|
||||
});
|
||||
```
|
||||
|
||||
You can fix code like this by converting your listener to use the [capture phase](https://javascript.info/bubbling-and-capturing#capturing). To do this, you can pass `true` as the third argument to `document.addEventListener`:
|
||||
You can fix code like this by converting your listener to use the [capture phase](https://javascript.info/bubbling-and-capturing#capturing). To do this, you can pass `{ capture: true }` as the third argument to `document.addEventListener`:
|
||||
|
||||
```js
|
||||
document.addEventListener('click', function() {
|
||||
// Now this event handler uses the capture phase,
|
||||
// so it receives *all* click events below!
|
||||
}, true);
|
||||
}, { capture: true });
|
||||
```
|
||||
|
||||
Note how this strategy is more resilient overall -- for example, it will probably fix existing bugs in your code that happen when `e.stopPropagation()` is called outside of a React event handler. In other words, **event propagation in React 17 works closer to the regular DOM**.
|
||||
|
||||
Reference in New Issue
Block a user