Search code examples
vue.jshref

How to use components for an href in vue.js?

I want to use a component as an href in an a tag. This is my code

<template>
    <a v-bind:href="Library">  </a>
</template>

<script>
import Library from './Library';

export default {
    name: "App",
    components: {
        Library,
    },
}
</script>

<style>
    
</style>

Unfortunately, I get an error saying I didn't use the library component. Does anyone know how to do this?

Kind regards Emiel

Solution

  • You cannot use a component as a string

    try this (example)

    <script>
import Library from './Library.js'
  export default {
    data() {
      return {
        Library: Library
      }
    }
}
</script>

<template>
  <a :href="Library" target="_blank">test</a>
</template>