How could i use script tag in render part with react

Question

I want to use this script in return phase in react which this script came from https://www.omise.co/card-js-api

    <script type="text/javascript" src="https://cdn.omise.co/card.js"


      data-key="YOUR_PUBLIC_KEY"
      data-image="PATH_TO_LOGO_IMAGE"
      data-frame-label="Merchant site name"
      data-button-label="Pay now"
      data-submit-label="Submit"
      data-location="yes"
      data-amount="10025"
      data-currency="thb"

      />

but it seems not working at all

Answer 1

Javascript must be inserted in betweeen the <script> and </script> tag.

<script type="text/javascript" src="https://cdn.omise.co/card.js"


      data-key="YOUR_PUBLIC_KEY"
      data-image="PATH_TO_LOGO_IMAGE"
      data-frame-label="Merchant site name"
      data-button-label="Pay now"
      data-submit-label="Submit"
      data-location="yes"
      data-amount="10025"
      data-currency="thb"
>
</script>

Self closing tag is not applicable as far as I am concerned.

This should give you a good reference - Why don't self-closing script tags work?

Answer 2

Use template strings with React

var script = `<script type="text/javascript" src="https://cdn.omise.co/card.js"
      data-key="YOUR_PUBLIC_KEY"
      data-image="PATH_TO_LOGO_IMAGE"
      data-frame-label="Merchant site name"
      data-button-label="Pay now"
      data-submit-label="Submit"
      data-location="yes"
      data-amount="10025"
      data-currency="thb"></script>`;

document.body.appendChild(script);