Question 21: Consider the following Vue.js 2 component using CDN. Aft…

1<div id="app">
2    <input v-model="newItem" placeholder="Add an item" />
3    <button @click="addItem">Add</button>
4
5    <ul>
6        <li v-for="(item, index) in items" :key="index">
7            {{ index + 1 }}. {{ item }}
8        </li>
9    </ul>
10</div>
11
12<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
13<script>
14    new Vue({
15        el: '#app',
16        data: {
17            newItem: '',
18            items: ['Apple', 'Banana']
19        },
20        methods: {
21            addItem() {
22                if (this.newItem) {
23                    this.items.push(this.newItem, this.newItem);
24                    this.newItem = '';
25                }
26            }
27        }
28    });
29</script>