如何在 ReactJS 中将 {variable} 连接到 href 标签中？

Question

我想在锚点标签的href字符串中使用花括号变量。 假设{entry.email}的值为[e-mail]，那么我正在尝试这样做：<a href="mailto:"+{entry.email}>{entry.email}</a> 以生成锚点标签 <a href="mailto:abc@xyz">abc@xyz

在下面的代码中：

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

但显然这并没有起作用，甚至没有编译。我该如何做到这一点？

- Saurabh kukade

Answer 1

使用模板字面量尝试

href={`mailto: ${entry.email}`}

或者

href={"mailto: "+ entry.email}

- Giorgi Moniava

Answer 2

字符串连接无论是使用引号还是字符串字面量，只要它们在花括号内声明即可正常工作...

选项一：

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

选项二：

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

- Josh Ua

Answer 3

你可以使用这个：

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

- yassine dotma

---

这与所接受的答案有何不同？ - JustCarty