Oto podstawowy komponent. Zarówno funkcje <ul>
, jak i <li>
mają funkcje onClick. Chcę tylko onClick na <li>
do ognia, a nie <ul>
. Jak mogę to osiągnąć?Reagowanie przed propagowaniem zdarzeń w komponentach zagnieżdżonych po kliknięciu
Grałem z e.preventDefault(), e.stopPropagation(), bez rezultatu.
class List extends React.Component {
constructor(props) {
super(props);
}
handleClick() {
// do something
}
render() {
return (
<ul
onClick={(e) => {
console.log('parent');
this.handleClick();
}}
>
<li
onClick={(e) => {
console.log('child');
// prevent default? prevent propagation?
this.handleClick();
}}
>
</li>
</ul>
)
}
}
// => parent
// => child
Miałem to samo pytanie, https://stackoverflow.com/questions/44711549/how-to-prevent-react-component-click-event-bubble-to-document –