I am passing an dynamic id from a route between two pages but i can not get the value in the other page . i gives me this error => Cannot read properties of undefined (reading 'params')

// This is the click event

<td class="label-cell" @click="f7router.navigate('/users-profile/'+user.id)" name="users-profile"> {{ user.firstname }}
        </td>

// This is my route


import UsersProfilePage from '../pages/administrators/users/users-profile.vue';

var routes = [
{
    
    path: '/users-profile/:userId',
    component: UsersProfilePage,
    name: 'users-profile',
  },
];

// I get error when i try to get to userId

  data(){

    return{

         userId :  this.$route.params.userId,

    }
  },

These are some of the things i have tried

this.$route.params.userId,
this.$f7router.params.userId,
this.$to.params.userId,
this.$routeTo.params.userId,
this.props.userId,
this.to.to.params.userId,
this.f7.$route.params.userId,

All of this did not work.
The page will load with the id in the url but i can not access the userId.

here => infallible-pare-r7l7zy - CodeSandbox

2 Likes

Thank you very much. it works perfect.
:pray: :pray: :pray: :handshake:
i am very grateful.