Установка идентификатора шаблона в b-таблице bootstrap

Question

Как мне установить атрибут id для этого тега th в b-table? У меня есть b-table вот так:

HTML:

  <b-table
    :items="group"
    :fields="columnsToDisplay"
    responsive>


    <template  slot="thead-top" slot-scope="data">
      <tr>
        <th id = "sample" style="background-color: #ffebcd; text-align: center; vertical-align: middle" rowspan="2" colspan="1">
          <span><strong>{{getValue1(key1)}}</strong></span></th>
        <th style="background-color: #ffebcd; font-size: small" rowspan="1" colspan="1">
          <span><strong>Desc:</strong> {{getValue2(key2)}}</span></th>
      </tr>
      <tr>
        <!--            <th rowspan="1" colspan="1"></th>-->
        <th style="text-align: center;background-color:#b9c0da" rowspan="1" colspan="5">
          <span><strong>Priorities</strong></span></th>
      </tr>
    </template>

  </b-table>

Javascript:

          getValue1: function (key) {
             let e = document.getElementById('sample')
             let url = 'https://example.com/' + this.arr[key].id
             e.setAttribute('href', url)
             return this.arr[key].id
         }

Это просто ошибка, возвращая null для значения e. Я в основном хочу установить href для определенного элемента DOM.