javascript - How to concatenate {variable} to href tag in react js? - Stack Overflow

admin管理员组

文章数量:1294325

I am trying to use variable in curly braces in anchor tag's href string. suppose value of {entry.email} is [email protected] then I am trying to do this<a href="mailto:"+{entry.email}>{entry.email}</a> to generate anchor tag <a href="mailto:abc@xyz">abc@xyz

in following code

const rows = props.contacts.map((entry, index) => {
    return (
        <tr key={index}>
            <td><a href="mailto:"+{entry.email}>{entry.email}</a></td>
        </tr>
    );

But clearly this is not working or even piling. How do I do this?

I am trying to use variable in curly braces in anchor tag's href string. suppose value of {entry.email} is [email protected] then I am trying to do this<a href="mailto:"+{entry.email}>{entry.email}</a> to generate anchor tag <a href="mailto:abc@xyz">abc@xyz

in following code

const rows = props.contacts.map((entry, index) => {
    return (
        <tr key={index}>
            <td><a href="mailto:"+{entry.email}>{entry.email}</a></td>
        </tr>
    );

But clearly this is not working or even piling. How do I do this?

• javascript
• reactjs
• react-redux

Share Follow edited Nov 3, 2021 at 11:20 Giorgi Moniava 28.7k99 gold badges5757 silver badges9898 bronze badges asked Nov 2, 2019 at 19:10 Saurabh kukadeSaurabh kukade 1,63622 gold badges1313 silver badges2525 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 9

Try with template literals

href={`mailto: ${entry.email}`} // or {`mailto: ${entry.email || ""}`} to avoid null or undefined being stringified

or

href={"mailto: "+ entry.email} // or {"mailto: " + (entry.email || "")} to avoid null or undefined being stringified

You can use this:

<a href={`mailto:${entry.email}`}>

String concatenation whether using quote marks or string literals will work as long as they are declared inside curly braces...

OPTION ONE:

<a href={"mailto: "+ entry.email}>

OPTION TWO:

<a href={`mailto: ${entry.email}`}>

本文标签： javascriptHow to concatenate variable to href tag in react jsStack Overflow