So übergeben Sie ein Ereignisobjekt in React

Methoden zum Übergeben von Ereignisobjekten in React: 1. Verwenden Sie „{(e) => this.deleteRow(id, e)}“ zum Übergeben. 2. Übergeben Sie „{this.deleteRow.bind(this, id)}“ Die Methode „“ wird weitergegeben.

Die Betriebsumgebung dieses Tutorials: Windows7-System, React17.0.1-Version, Dell G3-Computer.

Empfohlen: „Grundlegendes JavaScript-Tutorial“

Übergeben Sie Parameter (Ereignisobjekte) an den Ereignishandler

Übergeben Sie zusätzliche Parameter an die Funktion: die folgenden zwei Methoden

<button onClick={(e) => this.deleteRow(id, e)}>Delete Row</button>
<button onClick={this.deleteRow.bind(this, id)}>Delete Row</button>

Die beiden oben genannten Methoden sind äquivalent bzw. implementiert durch Pfeilfunktionen und Function.prototype.bind.

In den beiden obigen Beispielen wird der Parameter e als React-Ereignisobjekt als zweiter Parameter übergeben. Bei Pfeilfunktionen muss das Ereignisobjekt explizit übergeben werden, bei bind werden das Ereignisobjekt und weitere Parameter jedoch implizit übergeben.

Es ist erwähnenswert, dass bei der Übergabe von Parametern an die Abhörfunktion über die Bind-Methode, die in der Klassenkomponente definierte Abhörfunktion, das Ereignisobjekt e hinter den übergebenen Parametern platziert werden sollte, zum Beispiel:

class Popper extends React.Component{
    constructor(){
        super();
        this.state = {name:'Hello world!'};
    }
    
    preventPop(name, e){    //事件对象e要放在最后
        e.preventDefault();
        alert(name);
    }
    
    render(){
        return (
            <div>
                <p>hello</p>
                {/* Pass params via bind() method. */}
                <a href="https://reactjs.org" onClick={
                this.preventPop.bind(this,this.state.name)
                }>Click</a>
            </div>
        );
    }
}

Für weitere Programmierkenntnisse- Verwandtes Wissen finden Sie unter:Programmieren lernen! !

Das obige ist der detaillierte Inhalt vonSo übergeben Sie ein Ereignisobjekt in React. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!