Question 31: Consider the following Vue application with markup “inde…

1<div id = "app">
2    <input v-model = "name" @input = "do_something">
3    <p> {{age}} </p>
4</div>
5<script scr = "app.js"></script>

1new Vue({
2    el : "#app",
3    data : {
4        name : "#app",
5        age : 0,
6    },
7
8    mounted () {
9        try {
10        this.name = localStorage.getItem("name").split(" ")[0];
11        this.age = localStorage.getItem("name").split(" ")[1];
12        localStorage.setItem("name",
13           localStorage.getItem("name").split(" ")[0] + " " + this.name);
14        }
15        catch {
16            this.name = "Default";
17            this.age = "Default";
18        }
19
20    },
21
22    methods : {
23        do_something() {
24            localStorage.setItem("name", this.name);
25            localStorage.setItem("age", this.age);
26        }
27    }
28})