Balise href dynamique React in JSX

Question

// This Javascript <a> tag generates correctly React.createElement('a', {href:"mailto:"+this.props.email}, this.props.email)

Cependant, j'ai du mal à le recréer dans JSX

<a href="mailto: {this.props.email}">{this.props.email}</a> // => <a href="mailto: {this.props.email}"></a>

La balise href pense que le {this.props.email} est une chaîne au lieu de saisir dynamiquement la valeur de {this.props.email}. Des idées sur où je me suis trompé?

Patrick · Accepted Answer

Il renvoie une chaîne car vous l'affectez à une chaîne.

Vous voudrez le définir sur une propriété dynamique, qui inclut une chaîne au début

<a href={"mailto:" + this.props.email}>email</a>

Sean Clancy · Answer

Une façon légèrement plus ES6 de faire ce que Patrick suggère serait d'utiliser un modèle littéral:

<a href={`mailto:${this.props.email}`}>email</a>