Set a props as part of href attribute in VueJS [duplicate]

Question

I have defined an icon component and I want the props to be attached to the href link address as part of the URL. How can this be done correctly?

In fact, I want the amount of attribute href to look like this:

href="./img/icon.svg#ico_copy"

Vue.component('icon', {
  template: `
  <svg class="iconz">
  <use v-bind:href="'./img/icon.svg#'+ props.label"></use>
  </svg>`,
  props: {
    label: String,
  },
});

  <icon label="ico_copy"></icon>

Eze Kohon · Accepted Answer · 2022-03-02 13:46:29Z

1

you can create a computed property like this:

computed: {
  url() {
    return `./img/icon.svg#${this.label}`;
  }
}

answered Mar 2, 2022 at 13:46

Eze Kohon

3252 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Set a props as part of href attribute in VueJS [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related