Reagieren JS - Proxy-Ereignis?

Question

Ich bin neu in React und ich verwende Semantic-Ui-Reagieren. Ich versuche das Dropdown zu verwenden.

Wenn ich meinen Wert aus dem Dropdown bekommen und meine Funktion aufrufen möchte. Mein Event erhält ein Proxy-Objekt.

handleTagChange(e) { 
    console.log("handleTagChange"); 
    console.log(e); 
    } 

Aber wenn ich etwas anderes wie Test in der Funktion hinzufügen, die e.target.value Werke und Test ist das Proxy-Objekt. Warum das?

handleTagChange(test, e) { 
    console.log("handleTagChange"); 
    console.log(test); 
    console.log(e); 
    } 

Answer 1

Alle Ereignisbehandlungsroutinen, die semantic-ui-react Komponenten kehrt das Synthetic Ereignis als erstes Argument React implementieren (wie Vanille reagieren würde) und Komponente Stützen + relevanten Zustand als zweites Argument.

mit Ihrem Beispiel:

handleTagChange(e, data) { 
    console.log("handleTagChange"); 
    console.log(e); // React Synthetic Event 
    console.log(data.name); // `name` prop 
    console.log(data.value); // `value` that was just selected 
} 

---

Ausgabe Formalisierung dieser Änderung: https://github.com/Semantic-Org/Semantic-UI-React/issues/623

Erklärung der Logik dahinter aus der Diskussion hier: https://github.com/Semantic-Org/Semantic-UI-React/issues/638

Die event.target ist ein Browser Ereignis Eigenschaft. Viele Semantic UI-Komponenten wie Dropdown, Checkbox und Radio funktionieren jedoch nicht direkt mit nativen Browser-Formularsteuerelementen wie input und select. Sie sind mit stilisierten Markup und benutzerdefinierte interne State erstellt.

Aus diesem Grund sind für bestimmte Rückrufe keine systemeigenen Browserereignisse für verfügbar. Aus diesem Grund stellen alle Änderungsereignisse in Semantic-UI-React zuerst das Ereignis (sofern verfügbar), aber auch ein zweites Argument zur Verfügung, das die benötigten Daten enthält. Sie sollten für die meisten Aufgaben nie auf das native Browserereignis zugreifen müssen.