Details zur Ereignisbindung reagieren

Details zur Ereignisbindung reagieren
  • Die React-Ereignisbindung ähnelt der nativen DOM-Ereignisbindung
  • Syntax: on+Ereignisname={Ereignishandler} Beispiel: onClick={()=>{}}
  • Hinweis: React-Ereignisse verwenden die CamelCase-Namenskonvention

Ereignisbindung von Klassenkomponenten

importiere React von „react“;
importiere ReactDOM von „react-dom“;
Klasse App erweitert React.Component {
  handleKlick() {
    konsole.log(111);
  }
  rendern() {
    return (<button onClick={this.handleClick} > Klick mich</button >)
  }
}
ReactDOM.render(<App />, document.getElementById('root'))

Ereignisbindung der Funktionskomponente

importiere React von „react“;
importiere ReactDOM von „react-dom“;
Funktion App() {
  Funktion handleClick() {
    konsole.log(111);
  }
  // In der Funktionskomponente gibt es kein „this“, schreiben Sie also einfach den Funktionsnamen, ohne „this“ hinzuzufügen.
  return (<button onClick={handleClick}>Klick mich</button>)
}
ReactDOM.render(<App />, document.getElementById('root'))

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalt auf 123WORDPRESS.COM lesen können!

Das könnte Sie auch interessieren:
  • Detaillierte Erklärung der React-Ereignisbindung
  • Die Implementierung der Ereignisbindung in React verweist auf drei Methoden
  • Detaillierte Erklärung von vier Möglichkeiten, dies an Ereignisse in React zu binden
  • Vergleich verschiedener Methoden der Ereignisbindung beim React-Lernen

<<:  9 praktische CSS-Eigenschaften, die Web-Frontend-Entwickler kennen müssen

>>:  Tutorials der MySQL-Reihe für Anfänger

Artikel empfehlen

Reines CSS3 zum Erstellen eines Beispielcodes für Seitenwechseleffekte

Das, was ich vorher geschrieben habe, ist zu komp...

Zusammenfassung einiger meiner häufig verwendeten Linux-Befehle

Ich habe zwei Jahre lang im Betrieb und in der Wa...

Jmeter stellt eine Verbindung zum Datenbankprozessdiagramm her

1. Laden Sie den MySQL-JDBC-Treiber (mysql-connec...

Abkürzung für HTML DOCTYPE

Wenn Ihr DOCTYPE wie folgt ist: Code kopieren Der ...

Beherrschen Sie die häufig verwendeten HTML-Tags zum Zitieren von Inhalten auf Webseiten.

Verwenden Sie „blockquote“ für lange Zitate, „q“ ...

Dieser Artikel zeigt Ihnen detailliert, wie Sie SQL CASE WHEN verwenden

Inhaltsverzeichnis Einfache CASEWHEN-Funktion: Di...

Tutorial zur Oracle-Bereitstellung in einer Linux-Umgebung

1. Umgebung und zugehörige Software Virtuelle Mas...

Nützliche Codes zum Erstellen von Webseiten

<br />Wie kann ich die Bildlaufleiste auf de...