JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/vue"></script>
<div id='app' @keyup='nextItem'>
  <ul>
    <li v-for='item in items' :key='item.id' :class='{"active-item": currentItem === item.id}'>
      {{item.text}}
    </li>
  </ul>
</div>

CSS

.active-item {
  background-color: red;
}

JavaScript

new Vue ({
	el: '#app',
  data: {
  	currentItem: 1,
  	items: [{id: 1, text: 'some text'}, {id: 2, text: 'some other text'}, {id: 3, text: 'last text'}]
  },
  mounted () {
  document.addEventListener("keyup", this.nextItem);
  },
  methods: {
  	nextItem () {
    	if (event.keyCode == 38 && this.currentItem > 1) {
      	this.currentItem--
      } else if (event.keyCode == 40 && this.currentItem < 3) {
      	this.currentItem++
      }
    }
  }
})