diff options
| author | 2023-04-19 17:50:02 +0800 | |
|---|---|---|
| committer | 2023-04-19 17:50:02 +0800 | |
| commit | 56a6240bf700ac307342ed494d8bfbabe5c822dc (patch) | |
| tree | 0b1288a2ec1cbb538c11f4c122b6a97b9c55a05f /docs/.docs/content/2.api/2.composables.md | |
| parent | 3adc965dd09490b7efa1cce9f09b0a3b30970277 (diff) | |
| download | HydroRoll-56a6240bf700ac307342ed494d8bfbabe5c822dc.tar.gz HydroRoll-56a6240bf700ac307342ed494d8bfbabe5c822dc.zip | |
✨docs init
Diffstat (limited to 'docs/.docs/content/2.api/2.composables.md')
| -rw-r--r-- | docs/.docs/content/2.api/2.composables.md | 88 |
1 files changed, 0 insertions, 88 deletions
diff --git a/docs/.docs/content/2.api/2.composables.md b/docs/.docs/content/2.api/2.composables.md deleted file mode 100644 index 4c0bea2..0000000 --- a/docs/.docs/content/2.api/2.composables.md +++ /dev/null @@ -1,88 +0,0 @@ -# Composables - -Discover the Docus composables to use in your custom Vue components and pages. - -## `useDocus()` - -`useDocus()`{lang=ts} gives access to docus runtime config, all default values and your custom config from `app.config.ts` - -- `config` refers to the merged config of the current page. - -`main`, `header`, `aside`, `footer` and `titleTemplate` can be set from `_dir.yml` and any `page.md` file. - -The configs in `app.config` file will be used as defaults. - -```vue -<script setup> -const { config } = useDocus() -</script> - -<template> - <div> - <h1>{{ config.title }}</h1> - <p>{{ config.description }}</p> - </div> -</template> -``` - -- `tree` refers to the current navigation tree that is displayed in the `aside` component. - -```vue -<script setup> -const { tree } = useDocus() -</script> - -<template> - <DocsAsideTree :links="tree" /> -</template> -``` - -::source-link ---- -source: "composables/useDocus.ts" ---- -:: - -## `useMenu()` - -`useMenu()` gives access to `$menu` plugin controlling mobile navigation globally. - -```ts -const { - // Is menu visible - visible, - // Close menu function - close, - // Open menu function - open, - // Toggle menu function - toggle -} = useMenu() -``` - -::source-link ---- -source: "composables/useMenu.ts" ---- -:: - -## `useScrollspy()` - -`useScrollspy()` is used in `docs` layout to make the ToC display the currently visible headings. - -```ts -const { - // Headings on the page - visibleHeadings, - // Active headings (for the current page) - activeHeadings, - // Update headings (an array of DOM nodes) - updateHeadings -} = useScrollspy() -``` - -::source-link ---- -source: "composables/useScrollspy.ts" ---- -:: |
