javascript / beginner
Snippet
Template-Literale für dynamische Klassen
Template-Literale (mit Backticks ``) ermöglichen es dir, JavaScript-Ausdrücke mit ${} in Strings einzubetten. Dies ist sehr nützlich, um dynamische CSS-Klassennamen basierend auf Komponenten-Props zu erstellen.
snippet.js
javascript
1
2
3
4
5
6
7
function Alert({ type, message }) {return (<div className={`alert alert-${type}`}>{message}</div>);}
react
Erklärung
1
className={`alert alert-${type}`}
Kombiniert statische Strings mit dem Wert der Variable 'type', um einen vollständigen Klassennamen zu bilden.