route.params passing down to component props (deprecated since 4.1.4)

[qgates]

Regarding #1527 and #1531, and the changelog for 4.1.4, @posva has commented several times on this but I'm left confused because the online docs still suggest this approach for passing in component props with router.push. None of the alternatives suggested in the changelog indicate how we can pass params directly to component props when a route is defined thus:

{
   name: 'login',
   path: '/login',
   component: LoginScreen,
   props: true
}

With component LoginScreen.vue defined:

<script lang="ts">
  export default defineComponent({
    props: {
      aProp: String
    },
  ...

And I want to route to the component and pass in aProp along the lines of

  router.push( { name: 'login', params: { aProp: somevar } } )

Antipattern or not, the vue router docs indicate that the old approach still works, and I can't see another way to pass props in with routes defined with boolean props: true. Am I missing something here?

[posva]

There are not any examples showing that in the docs. If there we’re, we would indeed need to remove them.

to put it simply: params are defined in the path, therefore they are part of the URL

[qgates]

@posva perhaps the docs are just confusing then?

https://router.vuejs.org/guide/essentials/passing-props.html#boolean-mode

"When props is set to true, the route.params will be set as the component props."

[saifahn]

Yeah, I believe it could be a little ambiguous because it doesn't explicitly say that for a route to even have params, it needs to be part of the route path. But I would see it as though this is now just the truth for Vue Router 4 that is assumed across all the documentation.

i.e. A route with path: /login cannot have params and therefore cannot get props via route params, but a route with path: /post/:id has params and can.

[VIXI0]

I'm trying to migrate a big app to v4, until this date the docs still showing the boolean-mode that doesn't work at all and a video using the feature, PLEASE FIX THE DOCS.
(also now i have to define the same variable to pass a permission set to multiples components)

[VIXI0]

https://router.vuejs.org/guide/essentials/passing-props.html#boolean-mode

[autoantwort]

I have the same Problem, but what is the solution? I use params to pass ids as preselections to other views but they should not be part of the path (should not survive page reloads).
Creating a store, do a @click on a <router-link :to="{ name: 'item', params: { itemId: item.id } }"> adding the value to the store, extract the value in onMounted of the target view and set is as a param sounds wrong?