[Vuejs]-Vue: Setting initial data string with link

1đź‘Ť

âś…

Ideally, the objects with a link would have a property like url. Then, assuming all of the links should say “This is the link here”, you could do:

<div v-for="(box, index) in boxData" class="box">
  <div>
    <template v-if="box.url">
      This is the link <a :href="box.url">here</a>.
    </template>
    <template v-else>
      {{ box.body }}
    </template>
  </div>
</div>

Then you don’t need “This is the link here” in any of the objects.

-1đź‘Ť

You just have to put the data into the hyperlink like so:

<a :href="boxData.body">Here</a>

Much better

<router-link :to="boxData.body">Here</router-link>

Leave a comment