Add an href property to b-nav-item-dropdown

[scyclops]

Is your feature request related to a problem? Please describe...

Before the javascript has loaded, clicking on the b-nav-item-dropdown causes the page to change and there's no way to control what page the b-nav-item-dropdown goes to because it's hardcoded to '#'.

Describe the solution you'd like

Have b-nav-item-dropdown support a new href property that would allow changing the href while keeping the default as '#'.

The href value of '#' is hardcoded here:

bootstrap-vue/src/components/nav/nav-item-dropdown.js

Line 48 in 21fab35

href: '#',

[tmorehouse]

An href of # shouldn't change the current page (as it is a local target)

[scyclops]

It looks like the framework I'm using (Nuxt.js) is inserting a <base href="/app/"> tag into the HTML of every page which causes all relative URLs (including #) to be prefixed by /app/ when they are clicked. So if the page where the link is clicked isn't /app/ then the page will change to be /app/#. It looks like both Firefox and Chrome do this.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

In any case, it would still be useful in my app to be able to set the href property to make sure that when people click it before the javascript is loaded, the correct page loads (which isn't the current page in most cases). This probably isn't a common use case but I thought I'd throw it out there in case other people would find it useful.

[tmorehouse]

Perhaps, we couldswitch to using javascript: void 0 as the HREF in this case (unless Vue blocks javascipt URLs)

[tmorehouse]

Or if a router is detected, we could default it to the current $route with a hash of #

[tmorehouse]

The other option is to see if we can render a button instead of a link with href="#" (although it might require some additional SCSS).

One other option, might be to render a span instead of a link until the javascript is loaded (SSR hydrated)

[tmorehouse]

@scyclops in release v2.14.0 the toggle href will be set to the id provided to the <b-nav-item-dropdown> (if an id is provided).