Question

  {emails.map(item => (
      <tr><td>{item.date}</td><td>{item.from}</td><td>{item.to}</td><td>{item.subject}</td><td><a href="{item.s3_key}">view</a></td></tr>
    ))}

我正在尝试设置href =“ {item.s3_key}”，但它只返回字符串文字。我看不到此文档，有人可以帮忙吗？

Answer 1

在item.s3_key周围加上引号，它将被解析为字符串。删除它以获得所需的结果。

href={item.s3_key}

Answer 2

您应避免在包含可变值的属性或道具值上使用引号：

<a href={item.s3_key}>

如果您想组合字符串，则可以使用以下方式：

<a href={'view/'+item.s3_key}>

或使用template literal，例如：

<a href={`view/${item.s3_key}`}>

Answer 3

只需从道具价值中删除引号即可：

{emails.map(item => (
  <tr>
    <td>{item.date}</td><td>{item.from}</td>
    <td>{item.to}</td><td>{item.subject}</td>
    <td><a href={item.s3_key}>view</a></td>
  </tr>
))}

或者，如果需要连接某些文本值，请使用es6模板文字：

<a href={`any-additional-text-here${item.s3_key}or-here`}>

反应元素内的转义变量

3 个答案: