如何使用模板文字传递动态参数？

Question

我有一些非常简单的代码


function createAnswerElement(answer, index) {
  const key = `${answer}-${index}`;

  return `
    <p class="delete" onclick=someSillyFunc(${key})>x</p>
    `;
}

function someSillyFunc(key) {
  console.log(key);
}

"p tag" 附加到 div。如果我在没有参数或硬编码参数的情况下单击 "p tag"，它就可以正常工作。问题是当我尝试使用模板文字将变量键动态传递给函数时。这样做之后，我经常在控制台中收到错误 "Uncaught SyntaxError: missing ) after argument list."

我试过将关键变量用引号和各种其他东西引起来，但无法让它发挥作用。我错过了什么？

Answer 1

您忘记在 onclick 中将函数包裹在“ ”周围

return `
    <p class="delete" onclick="someSillyFunc(${key})">x</p>
    `;

如何使用模板文字传递动态参数？

How can I pass in dynamic arguments with template literals?

javascript

html

web

template-literals