I have a strange behaviour in my Laravel + Vue app. On the Checkout page there is a component that handles the payment method select, 3 radio buttons with a v-model on the paymentMethod in state with invoice initial value.
data() {
return {
paymentMethod: 'invoice'
}
},
When the user changes the payment method the setSelectedPaymentMethod function triggers, this method has a simple axios request that sends the selected value to the controller in order to save the paymentMethod selected in the session (for later usage in total calculations).
setSelectedPaymentMethod() {
return axios
.post('/payments/set-selected-method', {
selectedMethod: this.selectedPaymentMethod
})
.then(() => {
EventBus.$emit('payment-method-change');
});
},
Everything works fine, the payment method gets saved in the session, the only issue is that sometimes the payment method is saved but 0.5 seconds later it goes back to the value it was before... For example, the card is selected -> click on paypal, on laravel debugbar I can see the session value changing in this order: paypal and back to card without clicking again on the card option. I don't understand why the session variable goes back to previous value without clicking on any payment option, it's like the axios request triggers again with the old value but it doesent, the request goes only once everytime.
