I'm working on a small project which gets data from a json file and displays it in table format. Made search feature which is working fine, but I'd also like if the inputted letter/word will be highlighted(like user typing something into search input and that typed thing is being styled differently so it stands out in the result of the search). Can't figure out how to implement this, any help would be appreciated. I've really stuck on this one.

<tr v-for="teacher in mySearchFunc" :key="teacher.id">
  <td><router-link :to="{ name: 'Home'}">{{teacher.name}} </router-link></td>
  <td>{{teacher.birthday}}.{{teacher.birthmonth}}.{{teacher.birthyear}}</td>
  <td>{{teacher.phoneNum}}</td>
  <td>{{teacher.type}}</td>
  <td>{{teacher.id}}</td>
  <td><router-link to="#" class="subjectsBtn">Subjects</router-link></td>
  <td><button class="edit_btn"><span class="material-icons">edit</span></button></td>
  <td><button class="delete_btn"><span class="material-icons">delete</span></button></td>
</tr>

export default {
  data() {
    return {
      teachers: [],
      search: ''
    }
  }, 
  computed: {
    mySearchFunc() {
      return this.teachers.filter(teacher => 
       teacher.name.toLowerCase().includes(this.search.toLowerCase()))
    }
  }
}