Categories
Vue Answers

How to link to an external website with Vue.js and Vue Router?

Spread the love

Sometimes, we want to link to an external website with Vue.js and Vue Router.

In this article, we’ll look at how to link to an external website with Vue.js and Vue Router.

How to link to an external website with Vue.js and Vue Router?

To link to an external website with Vue.js and Vue Router, we can just use a regular anchor element.

For instance, we write

<template>
  <div>
    <a :href="websiteUrl" target="_blank">
      {{ url }}
    </a>
  </div>
</template>

to set the href prop to websiteUrl where websiteUrl is an external URL.

We set target to _blank to open a new tab when we click on the link.

Conclusion

To link to an external website with Vue.js and Vue Router, we can just use a regular anchor element.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *