title: How to call a onclick function inside a Template literal in React js
body: <p>Please help me on writing an on click function in template literals in react js. By clicking the button in template literal I need to call another function in react js. </p>
  
  <pre><code>  addPopupToLayer = (surface, layer) =&gt; {
    const { surface_type: { name, color } } = surface;
    const customPopup = `
     &lt;div class=${styles.tooltipHeader}&gt;
        &lt;h4&gt;${surface.name}&lt;/h4&gt;
        &lt;button onclick=${()=&gt; this.viewDetails(surface)}&gt;View&lt;/button&gt;
      &lt;/div&gt;   
      &lt;p&gt;${name}&lt;/p&gt;
    `;
    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) =&gt; {
     console.log("View Details is Called")
    }
  </code></pre>