Having Trouble with Delay and Loading in Async Component
Here is the code snippet causing issues:
<template>
<div>
<button @click="startMethod">start</button>
<async-component v-if="start" />
</div>
</template>
<script>
import Loading from '~/components/loading.vue'
import Error from '~/components/error'
const AsyncComponent = () => ({
component: import('~/components/someComponent.vue'),
loading: Loading, // not showing
error: Error, // working fine
delay: 2000, // not functioning
timeout: 3000 // works as expected
});
export default {
components: {
AsyncComponent
},
data: () => ({
start: false
}),
methods: {
startMethod(){
this.start = true
}
}
}
</script>
How can I properly delay the display of the loading component? I'm confused why it's not appearing and the delay feature isn't working.