0👍
The thing is, Vue doesn’t only reset the value of the input, it resets the entire HTML to the previous state. So the entire new markup gets overwritten by the old markup. I’ve decided that this is just not the way to go.
I’ve recreated the entire Woocommerce cart as a Vue component and now everything is working as expected. No more AJAX calls, everything changes on the fly.
0👍
Based on your response in the comments, I think you have a few options.
The most correct way would probably be to implement a Vuex store and update the variables there before refreshing the form and re-rendering the component. Then pull the variables from the store in either the mounted() or created() method.
The easier option would be to store the variables in a parent or root component. All Vue instances can access the root data object via this.$root.data. So you could update this.$root.data.quantity, then update and re-render your form component, and then update your quantity field with the value from this.$root.data.quantity.
Go with the second option if it’s a small or short term project, but the first would likely be considered proper.
Edit – I’ve updated your fiddle with the method I described above where you store the inputValue in the $root Vue component: https://jsfiddle.net/u39ap2hm/