Can I remove the span element with sr-only class in Bootstrap-vue table?

Here's an example of Bootstrap-vue table:

<template>
  <div>
    <b-table striped hover :items="items" :fields="fields"></b-table>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        // Note 'isActive' is left out and will not appear in the rendered table
        fields: [
          {
            key: 'last_name',
            sortable: true
          },
          {
            key: 'first_name',
            sortable: false
          },
          {
            key: 'age',
            label: 'Person age',
            sortable: true,
            // Variant applies to the whole column, including the header and footer
            variant: 'danger'
          }
        ],
        items: [
          { isActive: true, age: 40, first_name: 'Dickerson', last_name: 'Macdonald' },
          { isActive: false, age: 21, first_name: 'Larsen', last_name: 'Shaw' },
          { isActive: false, age: 89, first_name: 'Geneva', last_name: 'Wilson' },
          { isActive: true, age: 38, first_name: 'Jami', last_name: 'Carney' }
        ]
      }
    }
  }
</script>

and if open console the element of a thead would be look like:

<th role="columnheader" scope="col" tabindex="0" aria-colindex="1" aria-sort="none" class="">
   Last Name
   <span class="sr-only"> (Click to sort Ascending)</span>
</th>

Is there any ways I can remove

<span class="sr-only"> (Click to sort Ascending)</span>

with Bootstrap-vue property itself? If possible I don't want to delete it with JavaScript after it is built. Thanks