Javascript 模板文字 - 函数调用

Question

我想知道是否可以在 javascript 模板文字中调用函数。对于那些不知道的人 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals 我有这样的东西：

`<div class="product-card-labels">
    ${statuses.forEach(function(status) { return `<span class="product-card-label">${status.name}</span>` })}
</div>`

如您所见，我想调用 array.forEach()，它应该 return 字符串到模板。

Answer 1

您的模板语法正确，但在您的函数调用中没有返回任何内容。如果你使用 .map and .join the output (instead of .forEach which returns undefined)，它会工作正常。

`<div class="product-card-labels">
    ${statuses.map(function(status) { return `<span class="product-card-label">${status.name}</span>`; }).join('')}
</div>`

Javascript 模板文字 - 函数调用

Javascript template literals - function call

javascript

templates

literals