时间戳

首页 > 解决方案 > 使用 JSX 在 HTML 中调用方法或迭代数组

javascript - 使用 JSX 在 HTML 中调用方法或迭代数组

问题描述

我遇到了一个我以前从未遇到过的问题，老实说，这是我第一次不得不按照这些思路写一些东西，而一个解决方案似乎让我无法理解。

我正在使用 SendGrid 通过 Node 上的 express POST 发送 HTML 电子邮件。在我需要遍历购物车中的项目以自定义 HTML 并反映每个项目之前，这工作得非常好。

目前，在 HTML 中，我可以通过调用${req.body.data.item_name} This works great but at来打印一个变量，这${req.body.data.cart}是他们刚刚购买的一系列商品。对于 UIX，我想显示购买的所有商品的价格和数量列表。

我尝试过的一种方法是编写一个辅助函数：

function iterateItems(cart){
let body = ""

cart.forEach(function(item) {
      body = body + `<p style="Margin-top: 20px;Margin-bottom: 0;">${item.name}: $${item.price} QTY: ${item.qty}</p>`
    })
}

然后在 HTML 文本中尝试调用它${this.iterateItems(req.body.data.cart)}

它以未定义的形式返回，老实说，我有点期待。我很好奇解决这个问题并让它发挥作用的最佳方法是什么。

标签： javascriptnode.jsreactjshtml-email

解决方案

尝试使用 map 而不是 foreach ，应该可以解决问题

推荐阅读