Consider the following HTML, which includes Vue 2 and Vue Router 3 CDN links. const Home = { template: Home } const NewestComments = { template: Newest Comments } const TopComments = { template: Top Comments } const SearchResults = { template: Search Results } const TopBar = { template: Topbar } const NavBar = { template: Navbar } const VideoDetail = { template: Video Details } const routes = [ { path: '/', component: Home }, { path: '/video/:id', component: VideoDetail, props: true, children: [ { path: 'comments/top', component: TopComments }, { path: 'comments/newest', component: NewestComments } ] }, { path: '/search/:query', component: SearchResults, props: true } ]; new Vue({ el: '#app', template: , router: new VueRouter({ routes }), components: { TopBar, NavBar } }) Given this router setup, which of the following will happen when a user navigates to localhost:5000/#/video/5/comments/newest, assuming the webpage is hosted on localhost:5000?

(A) Option figure from the original question paper

(B) Option figure from the original question paper

(C) Option figure from the original question paper

(D) Option figure from the original question paper

Modern Application Development II · Quiz 2 · 1 Dec 2024 · September 2024 term

Question 11: Consider the following HTML, which includes Vue 2 and Vu…

Question 11

+4.5 marksOne correct option

Consider the following HTML, which includes Vue 2 and Vue Router 3 CDN links.

html

1<body>
2    <div id="app"></div>
3    <script>
4        const Home = { template: `<h1>Home</h1>` }
5        const NewestComments = { template: `<h3>Newest Comments</h3>` }
6        const TopComments = { template: `<h3>Top Comments</h3>` }
7        const SearchResults = { template: `<h3>Search Results</h3>` }
8        const TopBar = { template: `<h3>Topbar</h3>` }
9        const NavBar = { template: `<h3>Navbar</h3>` }
10        const VideoDetail = { template: `<div>Video Details <router-view />
11                                        </div>` }
12
13        const routes = [
14            { path: '/', component: Home },
15            {
16                path: '/video/:id',
17                component: VideoDetail,
18                props: true,
19                children: [
20                    { path: 'comments/top', component: TopComments },
21                    { path: 'comments/newest', component: NewestComments }
22                ]
23            },
24            { path: '/search/:query', component: SearchResults, props: true }
25        ];
26
27        new Vue({
28            el: '#app',
29            template: `<div>
30                            <TopBar />
31                            <NavBar />
32                            <router-view />
33                        </div>`,
34            router: new VueRouter({ routes }),
35            components: { TopBar, NavBar }
36        })
37    </script>
38</body>

Given this router setup, which of the following will happen when a user navigates to localhost:5000/#/video/5/comments/newest, assuming the webpage is hosted on localhost:5000?

Show answer

Correct answer

See the whole paper Take it as a mock test

Question 11 of 16 in the IIT Madras BS Modern Application Development II (MAD 2) Quiz 2 paper sat on 1 Dec 2024, in the September 2024 term (IIT M DIPLOMA AN EXAM QDD2 01 Dec 2024). It carries 4.5 marks.

Question 11: Consider the following HTML, which includes Vue 2 and Vu…

Question 11

More questions from this paper