You have a button inside a card component. When the button is clicked, an action is triggered, but when the card is clicked, a modal appears. However, clicking the button also triggers the modal. How can you prevent this?
- Use the event.stopPropagation() method on the button click event.
- Use a higher-order component to wrap the card component.
- Remove the button from the card component.
- Add more event listeners to the modal.
To prevent the card click event from propagating to the modal when the button inside the card is clicked, you should use event.stopPropagation() on the button's click event. This prevents the click event from bubbling up to the card and triggering the modal. The other options are not suitable for addressing this specific issue.
Loading...
Related Quiz
- In React, when a parent component renders, it will cause all its ________ components to potentially re-render as well.
- When using the map function to render a list in JSX, it's important to provide a unique ________ to each item.
- How to focus an input element on page load?
- What is the primary advantage of using CSS-in-JS libraries like Styled-components in React?
- What are default props?