I seem to be encountering an issue. After implementing a beforeRouteEnter method in one component, I am unable to access this.$route in another component.
Here is the structure of my app:
<div id="app">
<settings-modal></settings-modal>
<router-view name="CalendarMonthView"></router-view>
</div>
The CalendarMonthView component is rendered in the router view and contains a beforeRouteEnter method. However, once this method is added, the SettingsModal component reports that this.$params is undefined during its created() lifecycle hook. This was not the case before implementing beforeRouteEnter.
CalendarMonthView component
export default {
...
// to.params.selectedYear = 2019
// to.params.selectedMonth = 3
beforeRouteEnter (to, from, next)
{
Month.getDays({
year: to.params.selectedYear,
month: to.params.selectedMonth,
}).then(response => {
store.monthDays = response.data
next()
})
}
}
SettingsModal component
export default {
...
created()
{
// undefined
console.log('selectedYear: ', this.$route.params.selectedYear)
// undefined
console.log('selectedMonth: ', this.$route.params.selectedMonth)
}
}