mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-17 05:28:09 +01:00
docs(tabs): update examples
This commit is contained in:
@@ -9,6 +9,13 @@ const items = [
|
||||
]
|
||||
|
||||
const selected = ref('1')
|
||||
|
||||
// Note: This is for demonstration purposes only.
|
||||
onMounted(() => {
|
||||
setInterval(() => {
|
||||
selected.value = selected.value === '0' ? '1' : '0'
|
||||
}, 1000)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -0,0 +1,16 @@
|
||||
<script setup lang="ts">
|
||||
const open = ref(true)
|
||||
|
||||
// Note: This is for demonstration purposes only.
|
||||
onMounted(() => {
|
||||
setInterval(() => {
|
||||
open.value = !open.value
|
||||
}, 1000)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UTooltip v-model:open="open" text="Open on GitHub">
|
||||
<UButton icon="i-simple-icons-github" />
|
||||
</UTooltip>
|
||||
</template>
|
||||
@@ -117,43 +117,23 @@ props:
|
||||
---
|
||||
::
|
||||
|
||||
### Default value
|
||||
## Examples
|
||||
|
||||
Use the `default-value` prop to set the default value of the Tabs with the index of the item. You can also pass the value of one of the items if provided.
|
||||
### Control selected tab
|
||||
|
||||
::component-code
|
||||
---
|
||||
ignore:
|
||||
- items
|
||||
- content
|
||||
- defaultValue
|
||||
external:
|
||||
- items
|
||||
hide:
|
||||
- class
|
||||
props:
|
||||
defaultValue: '1'
|
||||
class: 'w-full'
|
||||
content: false
|
||||
items:
|
||||
- label: Account
|
||||
- label: Password
|
||||
---
|
||||
::
|
||||
|
||||
### Model value
|
||||
|
||||
You can control the selected tab by using the `v-model` directive.
|
||||
You can control the selected tab by using the `default-value` prop or the `v-model` directive with the index of the item.
|
||||
|
||||
::component-example
|
||||
---
|
||||
name: 'tabs-model-value-example'
|
||||
name: 'tabs-selected-example'
|
||||
props:
|
||||
class: 'w-full'
|
||||
---
|
||||
::
|
||||
|
||||
## Examples
|
||||
::tip
|
||||
You can also pass the value of one of the items if provided.
|
||||
::
|
||||
|
||||
### With content slot
|
||||
|
||||
|
||||
Reference in New Issue
Block a user