Skip to content

Commit b46d763

Browse files
rstoenescurstoenescu
committed
refactor: Functional components to regular components
1 parent 7122f17 commit b46d763

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+639
-719
lines changed

‎dev/components/css/list.vue‎

Lines changed: 38 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -20,44 +20,44 @@
2020

2121
<p class="caption">Dense List</p>
2222
<q-list dense>
23-
<q-item :key="n" v-for="n in 3">
23+
<q-item :key="'ak' + n" v-for="n in 3">
2424
<q-item-main label="List Item" />
2525
</q-item>
2626
</q-list>
2727
<q-list>
28-
<q-item :key="n" v-for="n in 3" dense>
28+
<q-item :key="'al' + n" v-for="n in 3" dense>
2929
<q-item-main label="List Item" />
3030
</q-item>
3131
</q-list>
3232

3333
<p class="caption">Sparse List</p>
3434
<q-list sparse>
35-
<q-item :key="n" v-for="n in 3">
35+
<q-item :key="'am' + n" v-for="n in 3">
3636
<q-item-main label="List Item" />
3737
</q-item>
3838
</q-list>
3939
<q-list>
40-
<q-item :key="n" v-for="n in 3" sparse>
40+
<q-item :key="'an' + n" v-for="n in 3" sparse>
4141
<q-item-main label="List Item" />
4242
</q-item>
4343
</q-list>
4444

4545
<p class="caption">No Border</p>
4646
<q-list no-border>
47-
<q-item :key="n" v-for="n in 3">
47+
<q-item :key="'ao' + n" v-for="n in 3">
4848
<q-item-main label="List Item" />
4949
</q-item>
5050
</q-list>
5151

5252
<p class="caption">Striped</p>
5353
<q-list striped>
54-
<q-item :key="n" v-for="n in 6">
54+
<q-item :key="'ap' + n" v-for="n in 6">
5555
<q-item-main label="List Item" />
5656
</q-item>
5757
</q-list>
5858

5959
<q-list striped-odd>
60-
<q-item :key="n" v-for="n in 3">
60+
<q-item :key="'aq' + n" v-for="n in 3">
6161
<q-item-main label="List Item" />
6262
</q-item>
6363
</q-list>
@@ -79,46 +79,46 @@
7979

8080
<p class="caption">Separator within Items</p>
8181
<q-list separator>
82-
<q-item :key="n" v-for="n in 3">
82+
<q-item :key="'ba' + n" v-for="n in 3">
8383
<q-item-main label="List Item" />
8484
</q-item>
8585
</q-list>
8686

8787
<q-list>
88-
<q-item :key="n" v-for="n in 3" separator>
88+
<q-item :key="'bb' + n" v-for="n in 3" separator>
8989
<q-item-main label="List Item" />
9090
</q-item>
9191
</q-list>
9292

9393
<p class="caption">Inset Separator within Items</p>
9494
<q-list inset-separator>
95-
<q-item :key="n" v-for="n in 3">
95+
<q-item :key="'bc' + n" v-for="n in 3">
9696
<q-item-main inset label="List Item" />
9797
</q-item>
9898
</q-list>
9999

100100
<q-list>
101-
<q-item :key="n" v-for="n in 3" inset-separator>
101+
<q-item :key="'bd' + n" v-for="n in 3" inset-separator>
102102
<q-item-main inset label="List Item" />
103103
</q-item>
104104
</q-list>
105105

106106
<p class="caption">Router Links</p>
107107
<q-list>
108-
<q-item to="/" exact v-for="n in 2" :key="n">
108+
<q-item to="/" exact v-for="n in 2" :key="'be' + n">
109109
<q-item-main inset label="Go to Home" />
110110
</q-item>
111111
</q-list>
112112

113113
<p class="caption">List Labels</p>
114114
<q-list>
115115
<q-list-header>List Label</q-list-header>
116-
<q-item :key="n" v-for="n in 2">
116+
<q-item :key="'bf' + n" v-for="n in 2">
117117
<q-item-main label="List Item" />
118118
</q-item>
119119
<q-item-separator />
120120
<q-list-header>Another List Label</q-list-header>
121-
<q-item :key="n" v-for="n in 3">
121+
<q-item :key="'bg' + n" v-for="n in 3">
122122
<q-item-main label="List Item" />
123123
</q-item>
124124
</q-list>
@@ -130,7 +130,7 @@
130130
</q-item>
131131
<q-item-separator inset />
132132
<q-list-header inset>Inset List Label</q-list-header>
133-
<q-item :key="n" v-for="n in 2">
133+
<q-item :key="'bh' + n" v-for="n in 2">
134134
<q-item-main inset label="List Item" />
135135
</q-item>
136136
<q-item-separator inset />
@@ -152,7 +152,7 @@
152152
</small>
153153
</p>
154154
<q-list highlight>
155-
<q-item :key="n" v-for="n in 2">
155+
<q-item :key="'bi' + n" v-for="n in 2">
156156
<q-item-main label="List Item" />
157157
</q-item>
158158
</q-list>
@@ -170,7 +170,7 @@
170170
</small>
171171
</p>
172172
<q-list link>
173-
<q-item :key="n" v-for="n in 2">
173+
<q-item :key="'bj' + n" v-for="n in 2">
174174
<q-item-main label="List Item" />
175175
</q-item>
176176
</q-list>
@@ -353,20 +353,20 @@
353353
<q-item-side right>
354354
<q-item-tile stamp>10 min ago</q-item-tile>
355355
<span class="text-amber">
356-
<q-item-tile icon="star" v-for="n in 2" :key="n" />
356+
<q-item-tile icon="star" v-for="n in 2" :key="'bk' + n" />
357357
</span>
358358
</q-item-side>
359359
</q-item>
360360
</q-list>
361361

362362
<q-list>
363363
<q-collapsible icon="inbox" indent label="Inbox" sublabel="Where your email is">
364-
<q-item v-for="n in 3" :key="n">
364+
<q-item v-for="n in 3" :key="'bl' + n">
365365
<q-item-side icon="mail" />
366366
<q-item-main :label="`Email ${n + 1}`" />
367367
</q-item>
368368
<q-collapsible icon="favorite" label="Favorites">
369-
<q-item v-for="n in 3" :key="n">
369+
<q-item v-for="n in 3" :key="'bm' + n">
370370
<q-item-side icon="mail" />
371371
<q-item-main :label="`Favorite ${n + 1}`" />
372372
</q-item>
@@ -377,13 +377,13 @@
377377
</q-item>
378378
</q-collapsible>
379379
<q-collapsible icon="send" label="Sent">
380-
<q-item v-for="n in 3" :key="n">
380+
<q-item v-for="n in 3" :key="'bn' + n">
381381
<q-item-side icon="mail" />
382382
<q-item-main :label="`Email ${n + 1}`" />
383383
</q-item>
384384
</q-collapsible>
385385
<q-collapsible icon="delete" label="Trash">
386-
<q-item v-for="n in 3" :key="n">
386+
<q-item v-for="n in 3" :key="'bo' + n">
387387
<q-item-side icon="mail" />
388388
<q-item-main :label="`Email ${n + 1}`" />
389389
</q-item>
@@ -399,21 +399,21 @@
399399
<q-item-tile icon="chat_bubble" color="green" />
400400
</q-item-side>
401401
</q-item>
402-
<q-item v-for="n in 3" :key="n">
402+
<q-item v-for="n in 3" :key="'bp' + n">
403403
<q-item-side avatar="/statics/boy-avatar.png" />
404404
<q-item-main label="John Doe" />
405405
<q-item-side right icon="chat_bubble" />
406406
</q-item>
407407
<q-item-separator />
408408
<q-list-header>Previous chats</q-list-header>
409-
<q-item v-for="n in 3" :key="n">
409+
<q-item v-for="n in 3" :key="'bq' + n">
410410
<q-item-side avatar="/statics/guy-avatar.png" />
411411
<q-item-main label="Jack Doe" />
412412
</q-item>
413413
</q-list>
414414

415415
<q-list>
416-
<q-item v-for="n in 3" :key="n">
416+
<q-item v-for="n in 3" :key="'br' + n">
417417
<q-item-side icon="star" color="yellow" />
418418
<q-item-main label="John Joe" />
419419
<q-item-side right>
@@ -423,39 +423,39 @@
423423
</q-item-side>
424424
</q-item>
425425
<q-item-separator inset />
426-
<q-item v-for="n in 3" :key="n">
426+
<q-item v-for="n in 3" :key="'bs' + n">
427427
<q-item-side letter="A" />
428428
<q-item-main label="John Joe" />
429429
<q-item-side right avatar="/statics/boy-avatar.png" />
430430
</q-item>
431431
<q-list-header inset>Normal - default color</q-list-header>
432-
<q-item v-for="n in 3" :key="n" link>
432+
<q-item v-for="n in 3" :key="'bt' + n" link>
433433
<q-item-side letter="A" />
434434
<q-item-main label="John Joe" />
435435
<q-item-side right icon="alarm" />
436436
<q-item-side right stamp="Stamp" />
437437
</q-item>
438438
<q-list-header inset>Normal - with color</q-list-header>
439-
<q-item v-for="n in 3" :key="n" link>
439+
<q-item v-for="n in 3" :key="'bu' + n" link>
440440
<q-item-side letter="A" :color="`red-${n + 2}`" />
441441
<q-item-main label="John Joe" />
442442
<q-item-side right icon="alarm" :color="`red-${n + 2}`" />
443443
<q-item-side right stamp="Stamp" :color="`red-${n + 2}`" />
444444
</q-item>
445445
<q-list-header inset>Inverted - default color</q-list-header>
446-
<q-item v-for="n in 3" :key="n" link>
446+
<q-item v-for="n in 3" :key="'bv' + n" link>
447447
<q-item-side letter="A" inverted />
448448
<q-item-main label="John Joe" />
449449
<q-item-side right icon="alarm" inverted />
450450
</q-item>
451451
<q-list-header inset>Inverted - with color</q-list-header>
452-
<q-item v-for="n in 3" :key="n" link>
452+
<q-item v-for="n in 3" :key="'bx' + n" link>
453453
<q-item-side letter="A" inverted :color="`red-${n + 2}`" />
454454
<q-item-main label="John Joe" />
455455
<q-item-side right icon="alarm" inverted :color="`red-${n + 2}`" />
456456
</q-item>
457457
<q-list-header inset>Normal - Tile - default color</q-list-header>
458-
<q-item v-for="n in 3" :key="n" link>
458+
<q-item v-for="n in 3" :key="'by' + n" link>
459459
<q-item-side>
460460
<q-item-tile letter>A</q-item-tile>
461461
</q-item-side>
@@ -468,7 +468,7 @@
468468
</q-item-side>
469469
</q-item>
470470
<q-list-header inset>Normal - Tile - with color</q-list-header>
471-
<q-item v-for="n in 3" :key="n" link>
471+
<q-item v-for="n in 3" :key="'bw' + n" link>
472472
<q-item-side>
473473
<q-item-tile letter :color="`red-${n + 2}`">A</q-item-tile>
474474
</q-item-side>
@@ -481,7 +481,7 @@
481481
</q-item-side>
482482
</q-item>
483483
<q-list-header inset>Inverted - Tile - default color</q-list-header>
484-
<q-item v-for="n in 3" :key="n" link>
484+
<q-item v-for="n in 3" :key="'bz' + n" link>
485485
<q-item-side>
486486
<q-item-tile letter inverted>A</q-item-tile>
487487
</q-item-side>
@@ -491,7 +491,7 @@
491491
</q-item-side>
492492
</q-item>
493493
<q-list-header inset>Inverted - Tile - with color</q-list-header>
494-
<q-item v-for="n in 3" :key="n" link>
494+
<q-item v-for="n in 3" :key="'ca' + n" link>
495495
<q-item-side>
496496
<q-item-tile letter inverted :color="`red-${n + 2}`">A</q-item-tile>
497497
</q-item-side>
@@ -504,7 +504,7 @@
504504

505505
<q-list>
506506
<q-list-header inset>Folders</q-list-header>
507-
<q-item v-for="n in 3" :key="n">
507+
<q-item v-for="n in 3" :key="'cb' + n">
508508
<q-item-side icon="folder" inverted color="grey-6" />
509509
<q-item-main>
510510
<q-item-tile label>Photos</q-item-tile>
@@ -514,7 +514,7 @@
514514
</q-item>
515515
<q-item-separator inset />
516516
<q-list-header inset>Files</q-list-header>
517-
<q-item v-for="n in 3" :key="n">
517+
<q-item v-for="n in 3" :key="'cc' + n">
518518
<q-item-side icon="assignment" inverted color="grey-6" />
519519
<q-item-main>
520520
<q-item-tile label>Vacation</q-item-tile>
@@ -724,7 +724,7 @@
724724
</q-list>
725725

726726
<q-list>
727-
<q-item v-for="n in 3" :key="n">
727+
<q-item v-for="n in 3" :key="'cd' + n">
728728
<q-item-side icon="phone" color="primary" v-if="n === 1" />
729729
<q-item-main :inset="n > 1">
730730
<q-item-tile label>(650) 555 - 1234</q-item-tile>
@@ -733,7 +733,7 @@
733733
<q-item-side right icon="chat_bubble" />
734734
</q-item>
735735
<q-item-separator inset />
736-
<q-item v-for="n in 3" :key="n">
736+
<q-item v-for="n in 3" :key="'ce' + n">
737737
<q-item-side icon="mail" color="primary" v-if="n === 1" />
738738
<q-item-main :inset="n > 1">
739739
<q-item-tile label>john@doe.com</q-item-tile>

‎dev/components/global/notify.vue‎

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -59,11 +59,6 @@
5959
</template>
6060

6161
<script>
62-
import {
63-
QBtn,
64-
QIcon
65-
} from 'quasar'
66-
6762
const alerts = [
6863
{ color: 'negative', message: 'Woah! Danger! You are getting good at this!', icon: 'report_problem' },
6964
{ color: 'pink', message: 'You need to know about this!', icon: 'warning' },
@@ -73,10 +68,6 @@ const alerts = [
7368
]
7469
7570
export default {
76-
components: {
77-
QBtn,
78-
QIcon
79-
},
8071
data () {
8172
return {
8273
visible: true,

‎src/components/action-sheet/QActionSheet.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export default {
5656
attrs: {
5757
tabindex: 0
5858
},
59-
on: {
59+
nativeOn: {
6060
click: this.__onCancel,
6161
keydown: this.__onCancel
6262
}
@@ -115,7 +115,7 @@ export default {
115115
attrs: {
116116
tabindex: 0
117117
},
118-
on: {
118+
nativeOn: {
119119
click: () => this.__onOk(action),
120120
keydown: (e) => this.__onOk(action)
121121
}

‎src/components/app/QApp.js‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,9 @@
11

22
export default {
33
name: 'q-app',
4-
functional: true,
5-
render (h, ctx) {
6-
const
7-
data = ctx.data,
8-
classes = data.staticClass
9-
10-
data.staticClass = `q-app${classes ? ` ${classes}` : ''}`
11-
return h('div', data, ctx.children)
4+
render (h) {
5+
return h('div', { staticClass: 'q-app' }, [
6+
this.$slots.default
7+
])
128
}
139
}

‎src/components/autocomplete/QAutocomplete.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -260,7 +260,7 @@ export default {
260260
'cursor-pointer': !result.disable
261261
},
262262
props: { cfg: result },
263-
on: {
263+
nativeOn: {
264264
mouseenter: () => { !result.disable && (this.selectedIndex = index) },
265265
click: () => { !result.disable && this.setValue(result) }
266266
}

0 commit comments

Comments
 (0)