Menu
Recent versions of Vue Router allow for links that open in a new tab, e.g. the following
<router-link :to="{ name: 'fooRoute'}" target="_blank"> Link Text </router-link> correctly renders an <a target="_blank">.
However, the same doesn't seem to work with a Vuetify v-btn, which supports router paths, for example if we want to use an icon.
<v-btn icon :to="{ name: 'fooRoute'}" target="_blank"> <v-icon>window</v-icon> Link Text </v-btn> Despite the component rendering an <a>, there is no target="_blank" attribute. How can we make this work?
236
to open a Vue Router link in a new tab, we can call the $router. resolve method to get the full URL from the route name, path, parameter and query values. Then we can use window. open to open the URL in a new tab.
If you want to open url in new tab in vue js then i will help to give simple example of open link in new tab in vuejs. we will do using jquery window. open and "_blank" option so it open in new tab. we will use simple jquery window for open new tab for url.
Try the following code snippet
<v-btn icon href="/fooRoute" target="_blank"> <v-icon>window</v-icon> Link Text </v-btn>Vuetify Button API
108
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
