javascript - 使用 onclick 时出现意外 token 错误

Question

这是我的代码

  const products = productArray.map(product =>
`
<tr>
  <td>${product.id}</td>
  <td>${product.type}</td>
  <td>${product.price}</td>
  <td><button onclick="${() => console.log('hello world')}">Examine</button></td>
</tr>
`
  );
  return tableBody.innerHTML = products.join('');

我只是不明白为什么我会收到这个指向 html 的意外 token 错误。我很确定这是一个非常愚蠢的行为，但我就是无法明白它在哪里。

Answer 1

您不能替换模板文字中的函数。它只是插入函数的源代码。

在这种情况下也没什么意义。您只需将函数主体放在 onclick 属性中即可。

  const products = productArray.map(product =>
`
<tr>
  <td>${product.id}</td>
  <td>${product.type}</td>
  <td>${product.price}</td>
  <td><button onclick="console.log('hello world')">Examine</button></td>
</tr>
`
  );
  return tableBody.innerHTML = products.join('');