mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-11 08:33:53 +00:00
docs(composables): add nested and plugin injection examples (#6743)
Co-authored-by: Pooya Parsa <pooya@pi0.io>
This commit is contained in:
parent
dc6b6ce621
commit
39a6054a44
@ -12,7 +12,7 @@ Under the hood, Nuxt auto generates the file `.nuxt/auto-imports.d.ts` to declar
|
||||
|
||||
Be aware that you have to run `nuxi prepare`, `nuxi dev` or `nuxi build` in order to let Nuxt generates the types. If you create a composable without having the dev server running, typescript will throw an error `Cannot find name 'useBar'.`
|
||||
|
||||
## Example
|
||||
## Usage
|
||||
|
||||
**Method 1:** Using named export
|
||||
|
||||
@ -47,6 +47,30 @@ const foo = useFoo()
|
||||
|
||||
:LinkExample{link="/examples/auto-imports/composables"}
|
||||
|
||||
## Examples
|
||||
|
||||
### Nested Composables
|
||||
|
||||
You can use a composable within another composable using auto imports:
|
||||
|
||||
```js [composables/test.ts]
|
||||
export const useFoo = () => {
|
||||
const nuxtApp = useNuxtApp()
|
||||
const bar = useBar()
|
||||
}
|
||||
```
|
||||
|
||||
### Access plugin injections
|
||||
|
||||
You can access [plugin injections](/guide/directory-structure/plugins#automatically-providing-helpers) from composables:
|
||||
|
||||
```js [composables/test.ts]
|
||||
export const useHello = () => {
|
||||
const nuxtApp = useNuxtApp()
|
||||
return nuxtApp.$hello
|
||||
}
|
||||
```
|
||||
|
||||
## How Files Are Scanned
|
||||
|
||||
Nuxt only scans files at the top level of the `composables/` directory, e.g.:
|
||||
|
Loading…
Reference in New Issue
Block a user