ReferenceError: paypal is not defined when i setup PayPal Checkout using vuejs

I have a component PaypalButton.vue and when i implement my button following these instructions: https://developer.paypal.com/docs/checkout/integrate/#

<template>
  <div>
    <div id="paypal-button-container"></div>
  </div>
</template>
    <script src="https://www.paypal.com/sdk/js?client-id=AZy2xQtNMcibA3BneS56WHoq1oqLhWdM7nsP3pwS02lr_1TOpC9Lnpp-IGbZQDS8K_xvMH5ssRmNPoDT" >
      // Required. Replace SB_CLIENT_ID with your sandbox client ID.
    </script>


<script>
import JQuery from 'jquery'
let $ = JQuery

var checkExist = setInterval(function() {
   if ($('#paypal-button-container').length) {
      console.log("Exists!");
      paypal
  .Buttons({
    createOrder: function(data, actions) {
      // This function sets up the details of the transaction, including the amount and line item details.
      return actions.order.create({
        purchase_units: [
          {
            amount: {
              value: "0.01"
            }
          }
        ]
      });
    },
    onApprove: function(data, actions) {
      // This function captures the funds from the transaction.
      return actions.order.capture().then(function(details) {
        // This function shows a transaction success message to your buyer.
        alert("Transaction completed by " + details.payer.name.given_name);
      });
    }
  })
  .render("#paypal-button-container");
//This function displays Smart Payment Buttons on your web page.

      clearInterval(checkExist);
   }
}, 100); // check every 100ms


export default {
  data: () => ({
    //
  })
};
</script>



I get this error..does someone know what is happening? I tried to import the paypal script in index.html but the same thing happens

enter image description here

Answers:

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.