Contacts List Vue Component

• Contacts List Properties
• Examples

Contacts List is not a separate component, but just a particular case of using and components.

Contacts List Properties

Examples

1. <f7-page>
2. <f7-navbar title="Contacts List"></f7-navbar>

4. <f7-list contacts-list>
5. <f7-list-group>
6. <f7-list-item title="A" group-title></f7-list-item>
7. <f7-list-item title="Aaron "></f7-list-item>
8. <f7-list-item title="Abbie"></f7-list-item>
9. <f7-list-item title="Adam"></f7-list-item>
10. <f7-list-item title="Adele"></f7-list-item>
11. <f7-list-item title="Agatha"></f7-list-item>
12. <f7-list-item title="Agnes"></f7-list-item>
13. <f7-list-item title="Albert"></f7-list-item>
14. <f7-list-item title="Alexander"></f7-list-item>
15. </f7-list-group>
16. <f7-list-group>
17. <f7-list-item title="B" group-title></f7-list-item>
18. <f7-list-item title="Bailey"></f7-list-item>
19. <f7-list-item title="Barclay"></f7-list-item>
20. <f7-list-item title="Bartolo"></f7-list-item>
21. <f7-list-item title="Bellamy"></f7-list-item>
22. <f7-list-item title="Belle"></f7-list-item>
23. <f7-list-item title="Benjamin"></f7-list-item>
24. </f7-list-group>
25. <f7-list-group>
26. <f7-list-item title="C" group-title></f7-list-item>
27. <f7-list-item title="Caiden"></f7-list-item>
28. <f7-list-item title="Calvin"></f7-list-item>
29. <f7-list-item title="Candy"></f7-list-item>
30. <f7-list-item title="Carl"></f7-list-item>
31. <f7-list-item title="Cherilyn"></f7-list-item>
32. <f7-list-item title="Chester"></f7-list-item>
33. <f7-list-item title="Chloe"></f7-list-item>
34. </f7-list-group>
35. <f7-list-group>
36. <f7-list-item title="V" group-title></f7-list-item>
37. <f7-list-item title="Vladimir"></f7-list-item>
38. </f7-list-group>
39. </f7-list>
40. </f7-page>