[React] zatrzymanie propagacji

Question

W jaki sposób w React zatrzymać propagacje po kliknięciu w element?

Dla komponentu ustawiam onClick, który ma za zadanie zamknięcie popupu.

<div className="popup-wrapper" onClick={this.props.close}>
                <div className="popup">

Chciałbym jednak, żeby po kliknięciu w .popup ta funkcja się nie wykonywała.

    closePopup = (e) => {
        e.stopPropagation();
        this.setState({
            popup: false
        })
    }

 

Answer 1

Może przypisz do elementu z klasą .popup onClick z inną funkcję. Inne rozwiązanie to dać warunek wykonania dla onClick w elemencie .popup-wrapper. Trzecie rozwiązanie to dać zdarzenie onClick nie na cały element tylko na inny wewnątrz.

Ogólnie poczytaj o conditional rendering w dokumentacji.