Question 15: Consider the following HTML with relevant Vue CDN attach…

1<div id="app">
2        <input v-model.number="price" type="number">
3        <input v-model.number="quantity" type="number">
4        <p>Total: {{ total }}</p>
5        <p>Last Updated By: {{ lastUpdatedBy }}</p>
6</div>
7
8    <script>
9        new Vue({
10            el: '#app',
11            data: {
12                price: 10,
13                quantity: 1,
14                total: 10,
15                lastUpdatedBy: 'initial'
16            },
17            watch: {
18                price: {
19                    handler(newVal) {
20                        this.total = newVal * this.quantity;
21                        this.lastUpdatedBy = 'price';
22                    }
23                },
24                quantity: {
25                    handler(newVal) {
26                        this.total = this.price * newVal;
27                        this.lastUpdatedBy = 'quantity';
28                    }
29                }
30            }
31        })
32    </script>