Passing input parameters to a component, how to implement?

Question

Vue.js

Hello! There is a button on the component, when the button is clicked:

<v-btn :to="{ path: '/field_of_activity', props: { messageId: 1}}">+</v-btn>

another component opens and I pass a parameter there, but the parameter remained empty as it was. If I pass the parameter through the router.js file, then everything is transferred normally, but I need to pass the parameter in my own way, what could be the problem?

Answer 1

:to="{ path: '/field_of_activity', props: { messageId: 1}}"

You messed something up here. Parameters are certainly not passed through the props property - it is used in the description of routes.
If you want via path, then replace props with query (or add the necessary parameters directly to path), and in the description of the corresponding route, specify something like props: route => ({ ...route.query }).
Or you can make the route named, then change path to name with the appropriate value, and props to params.
If you want both options to be supported, then in the route description (besides adding the name) it will be something like this:

props: route => ({ ...route.query, ...route.params })

UPD. Here's a demo of what it might look like.

Answer 2

On the side of the component, the parameter is specified in props?