Topic: Binding router to mdb-dropdown-item
Rogelio Sanchez free asked 5 years ago
How can I properly bind the internal vue router to a mdb-dropdown-item,
Link
router-to properties are not working,
if I put href="/mylink" it works, but it reloads the whole page, I want to use the internal vue router.
Thanks in advance!
Magdalena Dembna staff answered 5 years ago
Hi, I've just realized that your problem is probably caused by MDB Vue version. A router-link functionality was introduced in MDB Vue 5.2.0, so in order to use it, you need to update your version. Kind regards, Magdalena
Rogelio Sanchez free commented 5 years ago
Thank you so much Miss Dembna, Upgrading did the job.
Magdalena Dembna staff commented 5 years ago
I'm glad we could help, good luck with your project. Best regards, Magdalena
Nirav Parekh free answered 5 years ago
Hi, I'm trying to give generate the link like
http:localhost:8080/profile/{id}
where {id} is dynamic.
My base url is: http:localhost:8080
I tried using following html
<mdb-dropdown-item :to="'profile/' + user.profile.user_id">Profile</mdb-dropdown-item>
When I'm in other page, it works fine. but when I'm in already in profile page, it generates link like this:
http://localhost:8080/profile/profile/{id}
Rogelio Sanchez free answered 5 years ago
Yeah, sorry.these are my dropdown items
I tried to put router to="/" properties directly into the dropdown item,However it behaves like it had href="#", even If I put the "router" property.
I also tried to wrap dropdown items inside a router-link elemen and it workst, But it causes some strange margin or padding to the element.
Thanks a lot for your support.
Magdalena Dembna staff answered 5 years ago
Hi, Can you please provide a code snippet? I tested the code below and it seems to work fine, so I would be easier to find the source of the problem If you shared your example. Kind regards, Magdalena
<mdb-dropdown>
<mdb-dropdown-toggle color="default" slot="toggle">Basic dropdown</mdb-dropdown-toggle>
<mdb-dropdown-menu>
<mdb-dropdown-item to="/some-path">Action</mdb-dropdown-item>
</mdb-dropdown-menu>
</mdb-dropdown>
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 5.1.1
- Device: Mac
- Browser: Google Chrome
- OS: macOs High Sierra
- Provided sample code: No
- Provided link: No