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.