Consider the following application with markup “index.html” and javascript file “app.js”, and answer the given subquestions. index.html: app.js: const Home = { template: Welcome Home } const slotComp = { template: {{slot.description}} , data() { return { slots: [ { id: 1, description: 'Slot1', status: 'true' }, { id: 2, description: 'Slot2', status: 'true' }, { id: 3, description: 'Slot3', status: 'false' }, ], } }, computed: { availableSlots() { const slots = this.slots.filter((slot) => { return ( slot.status == this.route.params.status && slot.id > (this.route.query.offset ? parseInt(this.$route.query.offset) : 0) ) }) return slots }, }, } const router = new VueRouter({ routes: [ { path: '/', component: Home }, { path: '/slot/:status', component: slotComp }, ], }) new Vue({ el: '#app', router, }) Figure from the original question paper

Modern Application Development II · End Term · 11 Dec 2022 · September 2022 term · Set ETD1-2

MAD 2 End Term 11 Dec 2022 — Question 32

Question 32

+4.5 marksOne correct option

Consider the following application with markup “index.html” and javascript file “app.js”, and answer the given subquestions.

index.html:

html

1<body>
2    <div id="app">
3      <router-view />
4    </div>
5    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
6    <script
7src="https://unpkg.com/vue-router@3.0.0/dist/vue-router.js"></script>
8    <script src="app.js"></script>
9</body>

app.js:

javascript

1const Home = { template: `<div> Welcome Home</div>` }
2const slotComp = {
3  template: `<div>
4    <ol>
5      <li v-for='slot in availableSlots'> {{slot.description}} </li>
6    </ol>
7  </div>`,
8  data() {
9    return {
10      slots: [
11        { id: 1, description: 'Slot1', status: 'true' },
12        { id: 2, description: 'Slot2', status: 'true' },
13        { id: 3, description: 'Slot3', status: 'false' },
14      ],
15    }
16  },
17  computed: {
18    availableSlots() {
19      const slots = this.slots.filter((slot) => {
20        return (
21          slot.status == this.$route.params.status &&
22          slot.id >
23            (this.$route.query.offset ? parseInt(this.$route.query.offset) :
240)
25        )
26      })
27      return slots
28    },
29  },
30}
31const router = new VueRouter({
32  routes: [
33    { path: '/', component: Home },
34    { path: '/slot/:status', component: slotComp },
35  ],
36})
37
38new Vue({
39  el: '#app',
40  router,
41})

A
1. Slot1
2. Slot2
B
1. Slot2
2. Slot3
C
1. Slot1
D
1. Slot2

Show answer

Correct answer

D
1. Slot2

See the whole paper Take it as a mock test

Question 32 of 32 in the IIT Madras BS Modern Application Development II (MAD 2) End Term paper sat on 11 Dec 2022, in the September 2022 term (IIT M DIPLOMA AN1 EXAM ETD1 11 Dec 2022). It carries 4.5 marks.

MAD 2 End Term 11 Dec 2022 — Question 32

Question 32

More questions from this paper