In my Rails app, I am working with Vue.js and vue-router. I have a button that triggers a method called navigate. When the user clicks on this button, it sends a request to an API endpoint using the axios module and then moves to the next component with
this.$router.push({name: "RouteName"})Uncaught (in promise) undefined. My assumption is that this error is related to vue-router.
Here is part of the code from Home.vue component:
<template>
<div>
<button
id="select_button"
@click="onSelectClick"
>
Select
</button>
</div>
</template>
<script>
export default {
onSelectClick() {
this.$`axios.get('some-url').then(res => {
//print response in console
}).catch(err => {
// print error in console
})
this.$router.push({ name: 'route-name' }); // route-name is not home
}
}
</script>
<style>
</style>
Error message when double-clicking or clicking multiple times on the button:
Uncaught (in promise) undefined