Setting up in-Component Hooks
Finally, we can also use in-component Hooks as component life cycle Hooks where we want to scope those Hooks to component-level for better code maintenance or enhance the workflow where the same component needs to behave differently in a certain use case.
We can have the About component now with the beforeRouteEnter() Hook defined as follows:
<script>
export default {
data() {
return {
user: ''
}
},
beforeRouteEnter(to, from, next) {
if (!to.params || !to.params.user) {
next(comp => {
comp.user = 'Alex'
})
}
else {
next();
}
}
}
</script...
