Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <script>
- // give each todo a unique id
- let id = 0
- export default {
- data() {
- return {
- newTodo: '',
- todos: [
- { id: id++, text: 'Esta es una tarea' },
- { id: id++, text: 'Tarea 2' },
- { id: id++, text: 'Tarea 3' }
- ]
- }
- },
- methods: {
- addTodo() { //definir addTodo method
- if (this.newTodo.trim()) { //after trimming ver si no es un empty string
- this.todos.push({ //agregar a array de todos
- text: this.newTodo
- });
- }
- this.newTodo = '';
- },
- removeTodo(todo) {
- let index = this.todos.indexOf(todo);
- // console.log(index);
- this.todos.splice(index, 1);
- }
- }
- }
- </script>
- <template>
- <form @submit.prevent="addTodo">
- <input v-model="newTodo">
- <button>Add Todo</button>
- </form>
- <ul>
- <li v-for="todo in todos" :key="todo.id">
- {{ todo.text }}
- <button @click="removeTodo(todo)">X</button>
- </li>
- </ul>
- </template>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement