Vue: two params in url not loading correct route

Question

Comunity

I have a list of bookings (component: BookingListItem), which I render in my component "BookingView". Now I want to show the booking details when I click on one of these booking items. For this, I created a streched link, like that:

<router-link
      :to="`patients/${this.user.id}/bookings/${booking.booking_id}`"
      class="stretched-link"
    ></router-link>

I need the userid and the bookingid to make an api call from the ReadBookingView component (in this component the bookingdetails are displayed).

In my router.js file I defined the route like that:

    {
      path: "/patients/:userid/bookings/:bookingid",
      name: "readbooking",
      component: ReadBookingView,
    },

But when I load my BookingView component the following warnings are showed: There the userid and the bookingid are correct. But when I click on one of my booking items the following link is opened: http://URL:8081/4328

I hope y'all understand my explanation. Cause I don't understand why it's not loading correcty and I am very grateful for all your inputs.

Mahmudul Hasan · Accepted Answer · 2021-12-04 11:54:01Z

2

Try

<router-link
      :to="`/patients/${this.user.id}/bookings/${booking.booking_id}`"
      class="stretched-link"
    ></router-link>

answered Dec 4, 2021 at 11:54

Mahmudul Hasan

3772 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

roxena Over a year ago

oh god, this was the mistake... facepalm. Thank you so much!!

Mahmudul Hasan Over a year ago

No worries. Please accept the answer if it solved your question.

Collectives™ on Stack Overflow

Vue: two params in url not loading correct route

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related