Chron
4 days ago
62
1
Vue

Pass data to mounted hook

Posted 4 days ago by Chron

I have paypal inside mounted hook, it needs a dynamic amount value that will be based on button.

data() {
    return {
        totalPrice: 0,
    }
},
methods: {
    pay-discounted() {
                let totalPrice = 0;
                totalPrice += parseFloat(this.infos.price)/2;
                this.totalPrice = totalPrice.toFixed(2);
            },
    pay-undiscounted () {
                let totalPrice = 0;
                totalPrice += parseFloat(this.infos.price);
                this.totalPrice = totalPrice.toFixed(2);
            },

},
mounted() {
            paypal.Buttons({
                createOrder: function(data, actions) {
                    return actions.order.create({
                        purchase_units: [{
                            amount: {
                                value: this.totalPrice.toString(),
                            }
                        }]
                    });
                },
                onApprove: function(data, actions) {
                    return actions.order.capture().then(function(details) {
                        return axios.post('/test', {
                            headers: {
                                'content-type' : 'application/json'
                            }
                        })
                        .then(res => this.totalPrice = res.data)
                        .catch(err => console.log(err))
                    });
                }
            }).render('#paypal-button-container');
        },
        created() {
            axios.get('/test')
            .then(res => {
                this.infos = res.data
                this.totalPrice = res.data.price
        }

How can I do this?

Please sign in or create an account to participate in this conversation.