title: Getting error accessing data value in paypal function using vue and javascript
body: <p>I am trying to pass value for total to paypal function but getting error. Here is my code. Check this line <strong>amount: { total: this.total, currency: 'USD' }</strong></p>
  
  <pre><code>&lt;template&gt;
  .........
  &lt;/template&gt;
  
  &lt;script&gt;
  export default{
    data(){
      return{
        total:0 //
      }
    },
    methods:{
          createPaypalButton(){
        paypal.Button.render({
            env: 'sandbox', // sandbox | production
            // PayPal Client IDs - replace with your own
            // Create a PayPal app: https://developer.paypal.com/developer/applications/create
            client: {
                sandbox:    'xxxxxxxxxxxxxxxx',
                production: 'xxxxxxxxxxxxxxxx'
            },
            // Show the buyer a 'Pay Now' button in the checkout flow
            commit: true,
            // payment() is called when the button is clicked
            payment: function(data, actions) {
                // Make a call to the REST api to create the payment
                return actions.payment.create({
                    payment: {
                        transactions: [
                            {
                                amount: { total: this.total, currency: 'USD' } **//in above line this.total gives error.**
                            }
                        ]
                    }
                });
            },
            // onAuthorize() is called when the buyer approves the payment
            onAuthorize: function(data, actions) {
                // Make a call to the REST api to execute the payment
                return actions.payment.execute().then(function() {
                    window.alert('Payment Complete!');
                });
            }
  
        }, '#paypal-button-container');
      }
    }
  }
  &lt;/script&gt;
  </code></pre>