Advertisement
vlad999

Untitled

Feb 19th, 2020
517
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 0.68 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Usuários</title>
  5. <meta charset="UTF-8">
  6. <script src="https://cdn.jsdelivr.net/npm/vue"></script>
  7. </head>
  8. <body>
  9.  
  10. <div id="app">
  11.   <input v-model="newUser">
  12.   <button v-on:click="addUser">Add</button>
  13.  
  14.   <ol>
  15.     <li v-for="user in users">
  16.       {{ user.name }}
  17.     </li>
  18.   </ol>
  19. </div>
  20.  
  21. <script>
  22. var app = new Vue({
  23.   el: '#app',
  24.   data: {
  25.     newUser: '',
  26.     users: [
  27.       { name: 'João' },
  28.       { name: 'Pedro' },
  29.       { name: 'Guilherme' }
  30.     ]
  31.   },
  32.   methods: {
  33.     addUser: function () {
  34.       if(this.newUser) {
  35.         this.users.push({name: this.newUser})
  36.       }
  37.     }
  38.   }
  39. })
  40. </script>
  41.  
  42. </body>
  43. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement