Add onBeforeRouteEnter API to the list of composition API

[ahnpnl]

What problem does this feature solve?

Current the documentation about composition API https://router.vuejs.org/guide/advanced/navigation-guards.html#using-the-composition-api doesn't mention about onBeforeRouteEnter. I see in Options API, there is beforeRouteEnter hence there should be one for composition API too.

What does the proposed API look like?

export function onBeforeRouteUpdate(to, from) {
      //....
}

[posva]

onBeforeRouteEnter() doesn't exist, it's not possible to implement such guard with the composition api.

[a798032825]

onBeforeRouteEnter() doesn't exist, it's not possible to implement such guard with the composition api.

hello,may I get a case to put beforeRouteEnter into <script setup>.
just as onBeforeRouteleave can do.

[719media]

@posva Can you help us understand a little more on this? I'm confused because beforeRouteEnter exists in options API here: https://router.vuejs.org/guide/advanced/navigation-guards.html#using-the-composition-api

Not sure why it then couldn't be made to be used inside of setup() ? Could it be done in a PR, or is there a reason why it hasn't been done?

[posva]

It’s a technical limitation: setup runs when the component is created which happens after the navigation. Therefore you cannot add a navigation guard while the component is created

[taras-turchenko-moc]

@posva Hi! Can we do onBeforeRouteEnter hook using compiler macros? We can add this hook using defineOptions so I believe it's possible to make some shorthand for this to align options and composition apis

defineOptions({
    beforeRouteEnter: preloadGuard(() => loadInitial())
});

Also it would be nice to add route meta from component like nuxt doing

[posva]

The prefered direction are data loaders: https://uvr.esm.is/data-loaders/. You also have a definePage() macro for meta