Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-01-19 01:45:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: add an example of provide with object syntax plugins (#24993)

Browse Source
This commit is contained in:
Alireza Jahandideh 2024-01-02 14:02:42 -08:00 committed by GitHub
parent fc37eea30f
commit 7bd1ade096
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 14 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
docs/2.guide/2.directory-structure/1.plugins.md
View File

@ -157,6 +157,7 @@ Normally, Vue.js composables are bound to the current component instance while p
If you would like to provide a helper on the [`NuxtApp`](/docs/api/composables/use-nuxt-app) instance, return it from the plugin under a `provide` key. If you would like to provide a helper on the [`NuxtApp`](/docs/api/composables/use-nuxt-app) instance, return it from the plugin under a `provide` key.
::code-group
```ts [plugins/hello.ts] ```ts [plugins/hello.ts]
export default defineNuxtPlugin(() => { export default defineNuxtPlugin(() => {
return { return {
@ -166,6 +167,19 @@ export default defineNuxtPlugin(() => {
} }
}) })
``` ```
```ts [plugins/hello-object-syntax.ts]
export default defineNuxtPlugin({
name: 'hello',
setup () {
return {
provide: {
hello: (msg: string) => `Hello ${msg}!`
}
}
}
})
```
::
You can then use the helper in your components: You can then use the helper in your components: