arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-26 01:40:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

docs(carousel): use useTemplateRef

Browse Source
This commit is contained in:
Benjamin Canac
2024-10-15 15:21:53 +02:00
parent 8258cd3829
commit 46bd1cb002
1 changed files with 17 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
docs/content/3.components/carousel.md
View File

@@ -257,13 +257,29 @@ ignore:
### Expose ### Expose
When accessing the component via a template ref, you can use the following: You can access the typed component instance using [`useTemplateRef`](https://vuejs.org/api/composition-api-helpers.html#usetemplateref).
```vue
<script setup lang="ts">
const carousel = useTemplateRef('carousel')
</script>
<template>
<UCarousel ref="carousel" />
</template>
```
This will give you access to the following:
| Name | Type | | Name | Type |
| ---- | ---- | | ---- | ---- |
| `emblaRef`{lang="ts-type"} | `Ref<HTMLElement \| null>`{lang="ts-type"} | | `emblaRef`{lang="ts-type"} | `Ref<HTMLElement \| null>`{lang="ts-type"} |
| `emblaApi`{lang="ts-type"} | [`Ref<EmblaCarouselType \| null>`{lang="ts-type"}](https://www.embla-carousel.com/api/methods/#typescript) | | `emblaApi`{lang="ts-type"} | [`Ref<EmblaCarouselType \| null>`{lang="ts-type"}](https://www.embla-carousel.com/api/methods/#typescript) |
::note{to="https://vuejs.org/api/composition-api-helpers.html#usetemplateref" target="_blank"}
You can use `useTemplateRef` to get the component instance.
::
## Theme ## Theme
:component-theme :component-theme