在 VueJS 中将道具设置为 href 属性的一部分

Question

我已经定义了一个图标组件，我希望将道具作为 URL 的一部分附加到 href link 地址。如何正确完成？

事实上，我希望属性 href 的数量看起来像这样：

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>

Answer 1

您可以像这样创建计算 属性：

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