code.js 567 B

12345678910111213141516171819202122232425262728293031
  1. Vue.component('task', {
  2. template: '<li><slot></slot></li>',
  3. });
  4. Vue.component('task-list', {
  5. template: `
  6. <ul>
  7. <task v-for="task in tasks">
  8. {{ task.task }}
  9. </task>
  10. </ul>
  11. `,
  12. data() {
  13. return {
  14. tasks: [
  15. { task: 'Go to the store', completed: true },
  16. { task: 'Finish screencast', completed: false },
  17. { task: 'Fix dinner', completed: true },
  18. { task: 'Clean room', completed: false },
  19. { task: 'Make donation', completed: true },
  20. ]
  21. };
  22. }
  23. });
  24. const app = new Vue({
  25. el: '#root',
  26. data: {
  27. },
  28. });