VueJs open HREF in new tab with BootstrapVue

Asked By: Anonymous

I’m creating a table with bootstrap, one of the field is a link and should be opened in a new tab using target="_blank"

However, for some reason it doesn’t work, any idea why ?

Thanks.

Full code :

<b-table striped hover
  :items="applications"
  :filter="filter"
  :fields="fields"
  :bordered="true"
  :small="true"
  @filtered="onFiltered"
  >
  <template slot="lien" slot-scope="fields">
    <a :href="fields.value" :target="_blank">
    {{fields.value}}
    </a>
  </template>
</b-table>

EDIT :

Fixed with unbinding the target attribute thanks to Jom

Working code :

<b-table striped hover
  :items="applications"
  :filter="filter"
  :fields="fields"
  :bordered="true"
  :small="true"
  @filtered="onFiltered"
  >
  <template slot="lien" slot-scope="fields">
    <a :href="fields.value" target="_blank">
    {{fields.value}}
    </a>
  </template>
</b-table>

Solution

Answered By: Anonymous

I think you dont need to bind the target value as _blank is not a model