Ad

Dynamic Href Tag React In JSX

- 1 answer

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

However, I'm struggling to recreate it in JSX

<a target="_blank" rel="nofollow noreferrer" href="mailto: {this.props.email}">{this.props.email}</a>

// => <a target="_blank" rel="nofollow noreferrer" href="mailto: {this.props.email}"></a>

The href tag thinks the {this.props.email} is a string instead of dynamically inputting the value of {this.props.email}. Any ideas on where I went amiss?

Ad

Answer

It is returning a string because you are assigning it to a string.

You'll want to set it to a dynamic property, that includes a the string at the beginning of it

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

Ad
source: stackoverflow.com
Ad