20 | This is the most basic way to use the Tabs component. The tab list will 21 | be show at the top and the names of the tabs are derived from the title 22 | prop of each Tab component. 23 |
24 |37 | This example shows that the tab list items can be fully customized with 38 | there own icons if required. 39 |
40 |59 | This example shows that the tab list items can be displayed at the 60 | bottom using the reverse prop on the Tabs component. 61 |
62 |87 | This example shows that the tab list can be shown vertically by using 88 | the direction prop on the Tabs component. 89 |
90 |115 | This example shows that the tab list can be shown in the center or end 116 | by using the position prop on the Tabs component. 117 |
118 |143 | This example shows that the tab list can be shown in the center or end 144 | by using the position prop on the Tabs component. 145 |
146 |171 | This example shows a list of tabs generated from an array. This can be 172 | used to dynamically generate the tabs 173 |
174 |184 | This example shows a list of tabs generated from an array. This can be 185 | used to dynamically generate the tabs 186 |
187 |
5 | Recommended IDE setup:
6 | VSCode
7 | +
8 |
12 | Vetur
13 |
14 | or
15 | Volar
16 | (if using
17 | <script setup>)
18 |
See README.md for more information.
23 | 24 | Vite Docs 25 | 26 | | 27 | Vue 3 Docs 28 |
29 | 30 | 31 |
32 | Edit
33 | components/HelloWorld.vue to test hot module replacement.
34 |