JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.25/vue.js"></script>
<div id="app">
  <input type="text" v-model="query">
  
  <ul>
    <li v-for="item in items | byName query">{{ item.name }}</li>
  </ul>
</div>

JavaScript

Vue.filter('byName', function (data, input) {

  if(input){
      return data.filter(function (item) {
      		// we check if the item starts with 
          return item.name.startsWith(input);
      });
  }

  return data

});

new Vue({
  el: '#app',
  
  data: function() {
  	return {
    	query: '',
      items: [
      	{ name: "Harold" },
        { name: "Harry" },
        { name: "Reggy" },
        { name: "Rebus" },
        { name: "Hagrid" },
        { name: "Horace" }
        
      ]
    }
  }
});