Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-11 08:33:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: mention #components import for dynamic component (#22231)

Browse Source
This commit is contained in:
Julien Huang 2023-07-20 11:55:11 +02:00 committed by GitHub
parent 1f1de38d03
commit 6c517e919c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
docs/2.guide/2.directory-structure/1.components.md
View File

@ -98,17 +98,20 @@ This registers the components using the same strategy as used in Nuxt 2. For exa
## Dynamic Components ## Dynamic Components
If you want to use the Vue `<component :is="someComputedComponent">` syntax, then you will need to use the `resolveComponent` helper provided by Vue. If you want to use the Vue `<component :is="someComputedComponent">` syntax, you need to use the `resolveComponent` helper provided by Vue or import the component directly from `#components` and pass it into `is` prop.
For example: For example:
```vue ```vue
<script setup lang="ts"> <script setup lang="ts">
import { SomeComponent } from '#components'
const MyButton = resolveComponent('MyButton') const MyButton = resolveComponent('MyButton')
</script> </script>
<template> <template>
<component :is="clickable ? MyButton : 'div'" /> <component :is="clickable ? MyButton : 'div'" />
<component :is="SomeComponent" />
</template> </template>
``` ```