TodoList.vue

<template>
  <div>
    <input type="text" placeholder="New todo" v-model="todo" />
    <button v-on:click="add">Add</button><br />
    <table>
      <tbody>
        <tr v-for="(todo, index) in todos" v-bind:key="index"><td>{{todo}}</td></tr>
      </tbody>
    </table>
  </div>
</template>

<script>
  export default {
    name: 'TodoList',
    data() {
      return {
        todos: [],
        description: ''
      }
    },
    methods: {
      add: function() {
        this.todos.push(this.description);
        this.description = ''
      }
    },
  }
</script>

<style>
  table {
    margin-left:auto; 
    margin-right:auto;
  }
</style>