<div id="app">
   <ul>
    <li v-for="todo in todos">
     <span>{{ todo.text }}</span>
     <button @click="removeTodo($index)">X</button>
    </li>
   </ul>
  </div>

 <script>
    new Vue({
     el: '#app',
     data: {
      todos: [
       { text: 'Add some todos' },
       { text: 'Learn JavaScript' },
       { text: 'Learn Vue.js' },
       { text: 'Build Something Awesome' }
      ]
     },
     methods: {
      removeTodo: function (index) {
       this.todos.splice(index, 1);
      }
     }
    })
  </script>