javascript - 如何在React js中的Template文字内部调用onclick函数

请帮助我在react js中使用模板文字编写on click函数。通过单击模板文字中的按钮，我需要在react js中调用另一个函数。

  addPopupToLayer = (surface, layer) => {
  const { surface_type: { name, color } } = surface;
  const customPopup = `
   <div class=${styles.tooltipHeader}>
      <h4>${surface.name}</h4>
      <button onclick=${()=> this.viewDetails(surface)}>View</button>
    </div>
    <p>${name}</p>
  `;
  const customOptions = { className: styles.tooltip, width: '200' };
  const customlayer = layer.bindPopup(customPopup ,customOptions );

  customlayer.setStyle({
     fillColor: color,
     color,
     opacity: 1,
     fillOpacity: 0.48
  });
  return customlayer;
};


 viewDetails = (surface) => {
   console.log("View Details is Called")
  }

最佳答案

在调用函数时删除$符号，它将起作用

<button onclick={()=> ViewDetails(surface)}>View</button>

关于javascript - 如何在React js中的Template文字内部调用onclick函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/59678946/