question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

<b-dropdown-item> to is going to the server instead of using `vue-router`

See original GitHub issue

Version 2.0.0-rc.18

When clicking the dropdown link the browser reloads the page from the server instead of using the vue-router ( :to=“ii.url”).

<b-navbar toggleable="md" type="dark" variant="info" fixed="top">
  <b-navbar-toggle target="nav_collapse"></b-navbar-toggle>
     <b-collapse is-nav id="nav_collapse">
       <b-navbar-nav>
          <b-nav-item v-for="i in items" v-if="!i.items" :key="i.caption" :to="i.url">
               {{ i.caption }}
           </b-nav-item>
           <b-nav-item-dropdown v-for="i in items" v-if="i.items" :key="i.caption" :text="i.caption">
              <b-dropdown-item v-for="ii in i.items" :key="ii.id" :to="ii.url">
                   {{ ii.caption }}
               </b-dropdown-item>
             </b-nav-item-dropdown>
          </b-navbar-nav>
       </b-collapse>
       <b-navbar-brand href="#">{{ title }}</b-navbar-brand>
</b-navbar>

In version 2.0.0-rc.11 it correctly uses the vue-router.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:21 (10 by maintainers)

github_iconTop GitHub Comments

1reaction
WayneHillercommented, Apr 22, 2019

Thanks you very much @tmorehouse fixing the bundling issue (vue alias) also seemed to fix this issue, everything is working fine now.

1reaction
tmorehousecommented, Apr 11, 2019

There may have been changes to the b-link component in RC.17… let me check the history on the file to see if it is not detecting the router properly. I know it is definitely working when detecting <nuxt-link> (which is derived from <router-link>), as the docs site uses Nuxt.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Different History modes - Vue Router
The history option when creating the router instance allows us to choose among different history modes. Hash Mode #. The hash history mode...
Read more >
How to Use Vue Router: A Complete Tutorial - Vue School Blog
We will go over everything you need to know to use Vue Router ... from page to page on the client-side (without requesting...
Read more >
How To Navigate Between Views with Vue Router
This router makes an association with a view to a URL. In this tutorial, you are going to learn how to add the...
Read more >
Vue Router - catch all wildcard not working - Stack Overflow
Catch all routes (/*) must now be defined using a parameter with a custom regex: /:catchAll(.*). For example:
Read more >
Chapter 9. Understanding Vue Router - liveBook · Manning
This chapter is an introduction to Vue Router for readers who aren't familiar with the library. You'll learn about server-side routing, client-side routing, ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found