Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
mounted: function () {
const vue = this
const sandbox = vue.dev
paypal.Button.render({
env: vue.env,
payment: function (resolve, reject) {
vue.createPayment()
.then((response) => {
const data = response.data
if (sandbox) console.log('The payment was created!')
vue.$emit('paypal-paymentCreated', data)
resolve(data.paymentID)
}, (err) => {
reject(err)
})
},
// Pass a function to be called when the customer completes the payment
onAuthorize: function (data) {
// Pass the payment details for your transaction
// See https://developer.paypal.com/docs/api/payments/#payment_create for the expected json parameters
payment: vue.payment,
// Display a "Pay Now" button rather than a "Continue" button
commit: vue.commit,
// Pass a function to be called when the customer completes the payment
onAuthorize: vue.onAuthorize,
// Pass a function to be called when the customer cancels the payment
onCancel: vue.onCancel
}, assignTo(vue, propTypes.BUTTON));
paypal.Button.render(button, vue.$el);
}
};
// Pass the payment details for your transaction
// See https://developer.paypal.com/docs/api/payments/#payment_create for the expected json parameters
payment: vue.payment,
// Display a "Pay Now" button rather than a "Continue" button
commit: vue.commit,
// Pass a function to be called when the customer completes the payment
onAuthorize: vue.onAuthorize,
// Pass a function to be called when the customer cancels the payment
onCancel: vue.onCancel,
}, assignTo(vue, propTypes.BUTTON));
paypal.Button.render(button, vue.$el);
},
};
import React from 'react';
import ReactDOM from 'react-dom';
import paypal from 'paypal-checkout';
import PropTypes from 'prop-types';
const Button = paypal.Button.driver('react', { React, ReactDOM });
export default class PayPalButton extends React.Component {
constructor(props) {
super(props);
this.state = {
env: this.props.env,
client: {
sandbox: this.props.sandboxID,
production: this.props.productionID
},
amount: this.props.amount,
currency: this.props.currency,
commit: this.props.commit
};
}
import '@babel/polyfill'
import React from 'react';
import ReactDOM from 'react-dom';
import paypal from 'paypal-checkout';
const Button = paypal.Button.driver('react', { React, ReactDOM });
/**
* types
*/
interface State {
loaded: boolean;
error: boolean;
}
export type OnCancelData = {
billingID: string;
cancelUrl: string;
intent: string;
paymentID: string;
paymentToken: string;
}
app.ports.renderPaypalButton.subscribe(token =>
paypal.Button.render(
{
braintree,
client: {
sandbox: token,
production: token
},
env: "sandbox",
commit: true,
payment: (resolveData, actions) => {
return actions.braintree.create({
flow: "checkout",
intent: "sale",
amount: 3000,
currency: "JPY",
enableShippingAddress: false
});
render() {
const Button = paypal.Button.driver('react', { React, ReactDOM });
return (
<button> this.payment(data, actions) }
onAuthorize={ (data, actions) => this.onAuthorize(data, actions) }
{...this.props}
/>
);
}
}</button>